js 中事件的学习

在IE和W3C中的事件处理函数是不一样的

有dom0级方法和dom2级方法，而且有意思的我发现了一个问题

<button id="btn">按钮</button>
var button=document.getElementById('btn');
var button=document.querySelector("#btn");//最新的javascript api
button.onclick=function(){
    alert(this); //在W3C 下指向button 标签 //在IE 也指向了button 标签  dom 的0级方法
}
var hander=function(){
   alert(this); //在W3C指向了button 按钮标签，在IE中指向了object window
};
button.addEventListener("click",hander,false);   // ----->在W3C 的事件处理函数
button.removeEventListener('click',hander,false); // 移除事件
button.attachEvent("onclick",hander);//在IE下的window 添加事件
button.detachEvent("onclick",hander); // 在IE下移除事件

跨浏览器处理事件 dom 的0级方法和dom2级方法 和IE的事件处理函数

var EventUtil={
    addHandler:function(element,type,handler){
        if(element.addEventListener){
            element.addEventListener(type,handler,false);
        }else if(element.attachEvent){
            element.attachEvent("on"+type,handler);
        }else{
            element["on"+type]=handler;
        }
    },
    removeHandler:function(element,type,handler){
        if(element.removeEventListener){
            element.removeEventListener(type,handler,false);
        }else if(element.detachEvent){
            element.detachEvent("on"+type,handler);
        }else{
            element["on"+type]=null;
        }

    }
};
var handler=function(){
    alert(this);
};
//EventUtil.addHandler(button,'click',handler);//这时候在w3c和IE下的this 都指向了button 求解