js跨浏览器事件处理

var EventUtil = {

    addHandler: function(element,type,handler){
        if(element.addEventListener){
            element.addEventListener(type,handler,false);   //添加DOM2事件
        }else if(element.attachEvent){
            element.attachEvent("on"+type,handler);         //添加IE事件
        }else{
            element["on"+type] = handler;                    //添加DOM0事件
        }
    },
    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;
        }
    },
    getEvent : function(event){
        return event ? event : window.event;  //在使用DOM0级事件中中event作为window对象的一个属性存在
    },
    getTarget : function(event){
        return event.target || event.srcElement;  //IE中取得event.srcElement
    },
    preventDefault : function(event){
        if(event.preventDefault){
            event.preventDefault();
        }else{
            event.returnValue = false;  //IE中阻止默认事件
        }
    },
    stopPropagation : function(event){
        if(event.stopPropagation){
            event.stopPropagation();
        }else{
            event.cancelBubble = true;   //IE取消事件冒泡
        }
    }
}

addHandler()视情况分别为DOM0级方法、DOM2级方法或IE方法来添加事件。

removHandler()则是移除事件。

注：DOM0级对每个事件只支持一个事件处理程序。

EventUtil的使用例子，如下

window.onload = function(){
    var btn = document.getElementById("btn");
    EventUtil.addHandler(btn,"click",demo);
    //EventUtil.removeHandler(btn,"click",demo)
    function demo(){
        alert("ckicked !");
    }
}