事件冒泡

多个元素嵌套，这些元素都注册了相同的事件，如果里面的元素的事件触发了，外面的元素的该事件也自动触发了。

<div id="dv1">1
            <div id="dv2">2
                <div id="dv3">3</div>
            </div>
        </div>
        <script src="js/common.js"></script>
        <script type="text/javascript">
            my$('dv1').onclick=function(){
                console.log("点击dv1");
            };
            my$('dv2').onclick=function(){
                console.log("点击dv2");
            };
            my$('dv3').onclick=function(){
                console.log("点击dv3");
            };
        </script>

如何阻止事件冒泡

window.event.cancelBubble=true;

 e.stopProgation()`;

事件阶段

事件冒泡是从里到外，事件有三个阶段：

通过e.eventPhase这个属性可以知道当前的事件是什么阶段
1--->捕获阶段
事件捕获阶段：从外向内
2--->目标阶段
事件目标阶段：最开始选择的
3--->冒泡阶段
事件冒泡阶段：从里向外

addEventListener("没有on的事件类型",事件处理函数,控制事件阶段的)

事件捕获

当鼠标点击或者触发dom事件时，浏览器会从根节点开始由外到内进行事件传播，即点击了子元素，如果父元素通过事件捕获方式注册了对应的事件的话，会先触发父元素绑定的事件。

//addEventListener 有三个参数

IE5*:baba.attachEvent('onclick',fn)//冒泡

网景：baba.attachEventListener('onclick',fn)

W3C: baba.attachEventListener('onclick',fn,bool)

                //第一个是 事件名

                //第二个是 函数方法

                //第三个是 布尔值  

（判断是事件冒泡还是事件捕捉默认是falsy true 是事件捕捉  false 是事件冒泡）