Describe event capturing | Front End Quiz Interview Questions with Solutions | GreatFrontEnd
Event capturing is a lesser-used counterpart to event bubbling in the DOM event propagation mechanism. It follows the opposite order, where an event triggers first on the ancestor element and then travels down to the target element. Event capturing is rarely used as compared to event bubbling, but it can be used in specific scenarios where you need to intercept events at a higher level before they reach the target element. It is disabled by default but can be enabled through an option on addEventListener(). Event capturing is a propagation mechanism in the DOM (Document Object Model) where an event, such as a click or a keyboard event, is first triggered at the root of the document and then flows down through the DOM tree to the target element. Capturing has a higher priority than bubbling, meaning that capturing event handlers are executed before bubbling event handlers, as shown by the phases of event propagation: Note that event capturing is disabled by default. To enable it you hav
TL;DR Event capturing is a lesser-used counterpart to event bubbling in the DOM event propagation mechanism. It follows the opposite order, where an event triggers first on the ancestor element and then travels down to the target element. Event capturing is rarely used as compared to event bubbling, but it can be used in specific scenarios where you need to intercept events at a higher level before they reach the target element. It is disabled by default but can be enabled through an option on addEventListener() . What is event capturing? Event capturing is a propagation mechanism in the DOM (
saved by
related reading
- How Event Propagation and Delegation Work in JavaScript - DEV Communitydev.to
- Introduction to events - Learn web development | MDNdeveloper.mozilla.org
- Iteration protocols - JavaScript | MDNdeveloper.mozilla.org
- Intersection Observer API - Web APIs | MDNdeveloper.mozilla.org
- Microtasks and event looptr.javascript.info
- HTML Drag and Drop API - Web APIs | MDNdeveloper.mozilla.org
- HTMLElement: drop event - Web APIs | MDNdeveloper.mozilla.org
- HTMLElement: toggle event - Web APIs | MDNdeveloper.mozilla.org
- You Might Not Need an Effect – Reactreact.dev
- What the heck is the event loop anyway? | Philip Roberts | JSConf EUyoutube.com
- The Event Loop and Callback Hell - Wes Boswesbos.com
- An Introduction to the Browser Rendering Pipelinewebperf.tips