javascript--event bubbling and event capture

1. Event bubbling

Microsoft has proposed an event flow called event bubbling. Event bubbling can be figuratively likened to putting a stone into the water, and bubbles will come up from the bottom. That is, the event starts from the most inner element and propagates upward until the document object.

So the above example takes place under the concept of event bubbling. The order of the click events should be HTML --

2. Event Capture

Netscape proposes another event stream named event capture in contrast to event bubbling, the event starts from the outermost layer until the most specific element.

In the above example, the order in which the Click event takes place under the concept of event capture should be the page, HTML --

For an example of bubbling:

Html:

<class= "abc"  ID= "box"> click: Demo bubbling </ Div >

Javascript:

function () {var box = document.getElementById (' box '); Box.addeventlistener (function  () {alert (' Lee 'false); // change False to True to demonstrate capture function () {alert (' document 'false); // change False to True to demonstrate capture false);

javascript--event bubbling and event capture