Event propagation in javascript – Capturing and Bubbling

Event propagation is the propagation of an event through the elements in the HTML DOM. When an event happens phase1 – Event Capturing is done until the target is reached phase2 –  Bubbling is done executing handlers on the way Event bubbling and capturing are the two ways of event propagation in processing an event by the HTML DOM API.Event bubbling means that when an event happens, it propagates all the way up the parent to the ancestor elements. Bubbling When an event happens on an element,say click, it first runs the handlers on it, then on its parent, then all the way up.See the below example -The button inside the wh4 div was clicked. Onclick handler is on the ancestor wh4 is run.   Not every event get bubbled.Here is a list of  the most common event handlers. onAbort onBlur onChange onClick onDblClick onDragDrop onError onFocus onKeyDown onKeyPress onKeyUp onLoad onMouseDown onMouseMove onMouseOut onMouseOver onMouseUp onMove onReset onResize onSelect onSubmit onUnload Not every event bubbles.

If x is true then the event bubbles.You can check this creating the event By default all the Browsers support event bubbling. Event Capturing When an event happens capturing occurs in a way …

Share this page in social media platforms