JavaScript事件绑定与冒泡捕获

原生JS绑定事件
IE8(不包括IE8) 以上
绑定事件：element.addEventListener(event,function,useCapture); 
第一个参数是事件名称，例如‘click’，‘mouseover’等；
第二个参数是执行的方法
第三个函数是Boolean类型，表示该事件是冒泡还是捕获，默认是冒泡false

删除事件：element.removeEvebtListener(event,function);
IE8及以下 
绑定事件:element.attachEvent(event,function);
第一个参数是事件名称，例如‘onclick’，‘onmouseover’等；
第二个参数是执行的方法

删除事件：element.detachEvebt(event,function);

什么事冒泡和捕获呢？
element.addEventListener(event,function,useCapture);
有两个元素嵌套的时候，两个元素都加了事件，并且最后一个参数设置为false时，会先触发内部的事件，之后在触发外部事件，这种叫做冒泡，反之先触发外部事件在触发

内部事件。
代码例子：
html：
<div id="div1"  style="width: 200px;height: 100px;background-color: #009be3">

        <div id="div2" style="width: 150px;height: 80px;background-color: aqua">

        </div>

    </div>

JavaScript：

function a(event){

            alert("a")

        }

        function b(){

            alert("b")

        }

        var div1 = document.getElementById("div1");

        var div2 = document.getElementById("div2");

        if(div1.addEventListener){//判断浏览器是否支持该方法

               div1.addEventListener("click",a,true);// 运行结果 a b  

               div2.addEventListener("click",b);

        }else{

               div1.attachEvent("onclick",a);

               div2.attachEvent("onclick",b);

        }