JS里控制事件在捕获与冒泡阶段的触发

JS中的事件创建后，会按照如下过程在HTML元素间进行传播。

• 第一阶段：事件捕获，事件对对象沿DOM树向下传播
• 第二阶段：目标出发，运行事件监听函数
• 第三阶段：事件冒泡，事件沿DOM树向上传播

黑线表示的是事件的捕获阶段，捕获阶段捕获到三个click方法，红线表示的是事件的冒泡阶段，事件默认都是在冒泡阶段触发，所以三个click事件依次触发。

		var btn1 = document.getElementById("btn1");
        btn1.addEventListener("click", clickBtn1);
        function clickBtn1() {
            console.log("clickBtn1");
        }

        var div1 = document.getElementById("div1");
        div1.addEventListener("click", clickDiv1);
        function clickDiv1() {
            console.log("clickDiv1");
        }

        var div2 = document.getElementById("div2");
        div2.addEventListener("click", clickDiv2);
        function clickDiv2() {
            console.log("clickDiv2");
        }

	div1.addEventListener("click", clickDiv1,false);
    btn1.addEventListener("click", clickBtn1,false);
    div2.addEventListener("click", clickDiv2,true);

给按钮元素绑定clickDiv2,在捕获阶段(true为捕获阶段，false为冒泡阶段(默认))：

clickDiv2事件会在捕获阶段就触发，所以最先log出来。