Events can be activated at two occasions: At the beginning (“capture”), and at the end (“bubble”).
Events are executed in the order of how they’re defined. Say, you define 4 event listeners:
window.addEventListener("click", function(){console.log(1)}, false);
window.addEventListener("click", function(){console.log(2)}, true);
window.addEventListener("click", function(){console.log(3)}, false);
window.addEventListener("click", function(){console.log(4)}, true);
The log messages will appear in this order:
2
(defined first, usingcapture=true
)4
(defined second usingcapture=true
)1
(first defined event withcapture=false
)3
(second defined event withcapture=false
)