Event capturing
Event capturing is the phase of DOM event propagation in which an event travels from outer ancestors toward its target.
Secrets of the JavaScript Ninja, Second Edition
The phase of DOM event dispatch in which an event travels down the hierarchy toward its target.
- How it is used
- Uses capturing to control handler order when a DOM event propagates through nested elements.
- How deep it goes
- Explains both propagation phases and the addEventListener Boolean setting through nested click handlers, without descending into browser internals.
- Examples
- Compares click handlers on nested elements and document, including listeners registered for different propagation phases.
- What you can do after
- Operate/configure it with addEventListener’s third Boolean argument to select capturing instead of default bubbling.
Read how Secrets of the JavaScript Ninja, Second Edition explains event capturing →
React Quickly, Second Edition
The capture phase is the stage in event propagation during which an event travels from an outer target toward its originating target.
- How it is used
- Coordinates event handling when an application must observe interactions while they travel toward their originating elements.
- How deep it goes
- Defines propagation order and capture-listener registration, then defers React-specific differences to later treatment.
- Examples
- Uses a clicked button, ancestor traversal, addEventListener, capture: true, and eventPhase as concrete teaching artifacts.
- What you can do after
- Apply it via JavaScript addEventListener by registering callbacks specifically for the capture phase.
Read how React Quickly, Second Edition explains event capturing →
Related concepts
- event propagationpart of · Event propagation is the process by which an event travels through a hierarchy of elements during capture, target, and bubbling phases.
- event bubblingcontrasts with · Event bubbling is DOM event propagation in which an event travels from its target through successive ancestor nodes.
- addEventListenerused by · addEventListener is a web API method that registers a callback to run when a specified event occurs on an event target.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.