What's the event.target when the handler function is invoked during capturing and bubbling phase?

Question

As in the following example, when I click on the red div, the three alerts all shows that the event target is the div element, even though the handler function is actually registered on the containing document element. So I predict that the event target is always the most specific element? Is there official document dedicated to explaining this ?

http://jsbin.com/duzeqejoki/edit?html,css,js,output

Answer 1

It depends.. if you're using direct JS, it should be the most specific target of the registered event that bubbles up.

If you're using a framework or toolkit to handle or simplify event registrations, this may be modified to normalize behavior to the dom node the event was registered for, so that you can have more consistent expectations. YMMV.