Hi,I'm working through the Sitepoint book Simply Javascript and I'm having problems understanding the code execution in the section on event listeners, specifically the use of the keyword this and the results of the getElementsByTagName method.

The js code is here - most of the comments are my attempts at understanding the code. The Core methods are a library given in the book to deal with cross-browser issues regarding to event listeners.

I understood getElementsByTagName to give an array of that element so why does links[i] refer to the url and not the <a> element. Surely the url should be retrieved in a similar way to the title?

In the init function 'this' would refer to the window object - yes I get this. I thought that 'this' referred to the parent object of the current scope so why does it refer to the url in the showTipListener function?

getElementsByTagName doesn't return an array, it's something array-like called a NodeList. It's important to be aware of the distinction, although most of the time it behaves like an array.

You're right that alert("links[i]:" + links[i]); should give you an alert saying "links[i]: [object HTMLAnchorElement]" (at least in Firefox). It seems that for links it's decided that providing the href attribute instead is more useful. A stupid decision, if you ask me. You can fix it by doing this:

alert("links[i]:" + links[i].constructor);

showTipListener is triggered by an event on a DOM element (e.g. mouseover). When this happens, this refers to the element the event happened on. If you called the function manually (i.e. not via an event), then this would refer to the window object again.

If you haven't yet, I'd recommend visiting quirksmode.org and going through the Events tutorial. It's short and very clear.