js事件小结

 

 

首先事件绑定分为2种方法

一种为"DOM0级"方法，这里我理解为事件指定

 

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



             oDiv.onclick = function(){

                alert(this.id);

            };

第二种为"DOM2级"方法 我理解为绑定

IE8及以下：attachEvent(on+事件名,执行的函数);

其他浏览器（IE9+ FF chrome之类的）：addEventListener(事件名,执行函数,为true的时候是在捕获阶段执行函数，但常用的是false，在冒泡阶段执行函数);

兼容写法：

function addEvent(obj,ev,fn){



                if(obj.attachEvent)

                {

                    obj.attachEvent("on"+ev,fn);

                }

                else

                {

                    obj.addEventListener(ev,fn,false);

                }



}

值得注意的是：

1、与DOM2 与 DOM0 区别在于

addEvent("click",oDiv,function(){alert(111)});

addEvent("click",oDiv,function(){alert(222)});

//以上2行都有效，也就是可以给oDiv绑定2种不同的click事件;执行2次

//alert(111);alert(222)



//而DOM0则不行;最后定义的会覆盖前面；只执行1次 alert(222)



oDiv.onclick = function(){alert(111)};

oDiv.onclick = function(){alert(222)};

 

特别注意IE的坑！！

attachEvent绑定的方法 里面的this==window 而 addEventListener绑定的方法里面的this==绑定的对象

oDiv.attachEvent("onclick",function(){



alert(this==window);//true



})





oDiv.addEventListener("onclick",function(){



alert(this==window);//false

alert(this==oDiv)//true



})