Events in HTML

Capturing vs Bubbling

Upon an event the browser first looks for corresponding events handlers registered for the capture phase starting from the root tag <html> inwards.

Then it goes back from the innermost element outwards looking for events registered for the bubbling phase.

By default, events are registered in the bubbling phase if you use target.addEventListener(type, callback). However, you can force it to use the capture phase by explicitly passing a third parameter of true to the addEventListener method