JavaScript - HTML5 and CSS3 - page 521

means the click event is fired from the element where the event
occurred all the way up to the document root. This example attaches to
the document a click handler that determines what type of element was
clicked.

Returning to the example, edit events.js one more time:

function click_handler(event) {
var el = event.target;
switch (el.nodeName) {
case "DIV":
window.alert('Div');
break;
case "H1":
window.alert('Heading');
break;
case "P":
window.alert('Paragraph');
break;
}
}
function go() {
document.addEventListener('click', click_handler);
}
window.addEventListener('load', go);

b

Event object
as parameter

target
property

c

nodeName
property

d

e

Handles
click
events

Any function added as an event handler receives the event object as a
parameter B . The target property of the event object c is the element
where the event originated. The element object has a nodeName property
d that tells you the type of element clicked. You attach click_handler to
the document to handle all click events e .