Event bubbling is a way of event propagation in the HTML DOM. It relates to the order in which events are propagated in nested elements.
In bubbling, when an event happens, the handler of the innermost element runs, then the parents, and then the further ancestor elements. In other words, events bubble up or propagate the DOM tree upwards.
Note: All events bubble up with a few exceptions, like
focus. To prevent an event from bubbling up, you can use
Consider the four nested elements:
Clicking on the p element calls the
onclick event handlers in the order:
Notice, we used
event.stopPropagation() inside the
article to prevent an event from bubbling up to the
View all Courses