JavaScript 事件对象Event的工具类

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;
        }
    },
    
    //获取事件对象Event
    getEvent: function(event){
        return event? event:window.event;
    },
    //获取目标元素
    getTarget: function(event){
        return event.target || event.srcElement;
    },
    //阻止默认操作方式
    preventDefault: function(event){
        if (event.preventDefault) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    },
    //停止冒泡事件
    stopPropagation: function(event){
        if (event.stopPropagation) {
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    }
    
};

测试代码：

$(document).ready(function(){
    var btn = document.getElementById("btn");
    btn.onclick = function(event){
        event = EventUtil.getEvent(event);
        var target = EventUtil.getTarget(event);
        alert(target);
        EventUtil.stopPropagation(event);
    }
    document.body.onclick = function(event){
        alert("BODY");
    }
});