事件的绑定方式

一.赋值式(DOM0级事件绑定):ele.事件类型=function(){}

　　不能重复绑定

var obox = document.querySelector(".box")
obox.onclick = function(){
    console.log（1）
}
obox.onclick = function(){
    console.log（2）
}
上式结果得到  2    ，  覆盖效果
删除事件
obox.onclick.null;  得到 空

二.监听式(DOM2级事件绑定)

　　特定的方法实现：ele.addEventListener

能重复绑定

obox.addEventListener("click",function(){
    console.log("hello")      //hello
},false)
obox.addEventListener("click",function(){
    console.log("world")     //world
},false)

能全部打印出来
删除事件监听：
obox.removeEventListener(type,fn,false)
obox.removeElementListener("click",fn1,false)
obox.removeElementListener("click",fn1,false)

以下是IE浏览器的支持
绑定：obox.attachEvent(type,fn)  ele前加 ”on“
console.log(box,attachEvent)

obox.attachEvent("onclick",fn1)
function fn1(){
    console.log("hhaha")
}
obox.attachEvent("onclick",fn2)
function fn2(){
    console.log("heihhh")
}    
删除：
obox.detachEvent("onclick",fn1)
兼容
        function addEvent(ele,type,cb){
            if(ele.attachEvent){
                ele.attachEvent("on"+type,cb)
            }else{
                ele.addEventListener(type,cb,false)
            }
        }
        function removeEvent(ele,type,cb){
            if(ele.detachEvent){
                ele.detachEvent("on"+type,cb)
            }else{
                ele.removeEventListener(type,cb,false)
            }
        }

事件流的状态：

    事件的触发顺序

        事件冒泡：从里向外

        事件捕获：从外向里

            true:捕获

            false：冒泡

        目标阶段当前元素房前事件

var obox = document.querySelector(".box")
    var obox1 = document.querySelector(".box1")
    var obox2 = document.querySelector(".box2")


    obox.addEventListener("click",function(){
        alert("red的冒泡")
    },false)

    obox.addEventListener("click",function(){
        alert("red的捕获")
    },true)
    
    obox1.addEventListener("click",function(){
        alert("green的冒泡")
    },false)

    obox1.addEventListener("click",function(){
        alert("green的捕获")
    },true)

    obox2.addEventListener("click",function(){
        alert("blue的冒泡")
    },false)

    obox2.addEventListener("click",function(){
        alert("blue的捕获")
    },true)