Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript and the DOM (Retiring) Traversing the DOM Using parentNode to Traverse Up the DOM

Traverse vs Event Bubbling

I am totally confused between traverse and event bubbling? Can someone explain please,

1 Answer

Ezell Frazier
Ezell Frazier
22,110 Points

Event Bubbling and DOM Traversal aren't competing against one another. Event Bubbling is part of the concept of DOM Traversal.

If I click a button element within a div, inside of another div, inside of a body tag, I can attach an event listener to the body tag and ask JavaScript to check if that deeply nested button has been clicked.

Event bubbling is similar to dropping a pencil in an empty auditorium. A person at the other end of the auditorium likely heard the pencil drop, as the sound traverses from the point of impact to the listener's ear.

A parent element always has the capacity to listen to any of its child elements, or in the concept of event bubbling, a parent element is the surface of a drink in a glass, and the bubbles are the events traveling to the top.