DOM操做中的事件流概念

在HTML中多个嵌套的标签，若是他们都拥有相同触发条件的事件，最内部的标签事件被触发后，外边多个标签的同类型事件也会被触发，多个标签同时执行他们同类型事件效果称为“事件流”

如何避免事件流？？

经过获取事件对象能够阻止事件流，

主流浏览器(IE9以上版本浏览器)：

    node.onclick = function(evt){evt就是事件对象}

    addEventListener(类型,function(evt){}/函数名字);

    function 函数名称(evt){}

    事件处理函数的第一个形参就是事件对象

    event.stopPropagation();

举个栗子：：

下面3个div，他们都有“onClick”事件

<div id="d1" class="dd1" onClick="dj1()">
   <div id="d2" class="dd2" onClick="dj2()">
        <div id="d3" class="dd3" onClick="dj3()">
        </div>
   </div>
</div>

var bt1= document.getElementById("d1");var bt2= document.getElementById("d2");var bt3= document.getElementById("d3");    function dj1(){    alert("你好d1");}    function dj2(){    alert("你好d2");}bt2.addEventListener('click',function(e){e.stopPropagation()},false);bt3.addEventListener('click',function(e){e.stopPropagation()},false);function dj3(){    alert("你好d3");}