What is the difference between e.target and e.currentTarget?
e.target is the element that triggered the event (the actual clicked element). e.currentTarget is the element the listener is registered on. In bubbling, e.target stays the same, e.currentTarget changes as the event bubbles.
Verify This Answer
Cross-check this information using these trusted sources:
More FAQs in Event Bubbling: Complete Guide for Interviews
Definition (bottom-up propagation), three phases (capturing, target, bubbling), default is bubbling, stopPropagation vs stopImmediatePropagation, capturing (third arg true), event delegation, and e.target vs e.currentTarget.
Add one listener on the parent: parent.addEventListener('click', e => { if (e.target.matches('li')) handle(e.target); }). Check e.target to determine which child was clicked. Works for dynamically added children.
Capturing (top-down: document to target's parent), Target (event reaches the target), Bubbling (bottom-up: target to document). Default listeners run in the bubbling phase.
Still have questions?
Browse all our FAQs or reach out to our support team