js跨浏览器的事件侦听器和事件对象的使用方法

var EventUtil = {    // 添加侦听事件    addEventListener:function (element, type, handler) {      // IE9+、Firefox、Safari、chrome和Opera      if(element.addEventListener) {        element.addEventListener(type, handler, false);      }      // IE8-      else if(element.attachEvent) {        element.attachEvent("on" + type, handler);      }    },        // 移除侦听事件    removeEventListener:function (element, type, handler) {      // IE9+、Firefox、Safari、chrome和Opera      if(element.addEventListener) {        element.removeEventListener(type, handler, false);      }      // IE8-      else if(element.attachEvent) {        element.detachEvent("on" + type, handler);      }    },        // 获取事件对象    getEvent:function(event) {      if(typeof event == "undefined") {        event = window.event; // IE浏览器      }      return event;    },        // 获取触发事件的元素    getTarget:function(event){      if(typeof event.srcElement == "undefined") {        return event.target;      }else {        return event.srcElement; // IE浏览器      }    },        // 获取事件类型    getType:function(event) {      return event.type;    },        // 获取按键键码    getCharCode:function(event) {      if(typeof event.keyCode == "number") {        return event.keyCode; // IE8-、Firefox和opera      }else {        return event.charCode;       }    },        // 获取鼠标相对于文档的位置,即页面坐标位置    getPagePosition:function(event) {      var pageX = event.pageX,        pageY = event.pageY;      if(pageX == undefined) {        pageX = event.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft);      }      if(pageY == undefined) {        pageY = event.clientY + (document.body.scrollTop || document.documentElement.scrollTop);      }      return {        pageX:pageX,        pageY:pageY      };    },        // 阻止事件的默认行为    preventDefault:function(event) {      if(event.preventDefault){        event.preventDefault();      }else {        event.returnValue = false; // IE浏览器      }    },        // 阻止事件冒泡    stopPropagation:function(event) {      if(typeof event.cancelBubble == "undefined") {        event.stopPropagation();      }else {        event.cancelBubble = true; // IE浏览器      }    }  };

<div id="box" style="color:red;width: 100%;height:200px;" >  <input type="button" value="点击" id="btn" /></div><a href="http://www.test.com" id="a">test</a>

var box = document.querySelector("#box");  box.onclick = function(event) {    event = EventUtil.getEvent(event);    alert(EventUtil.getType(event));    alert(EventUtil.getTarget(event));  };  var input = document.querySelector("input");  input.onclick = function(event) {    event = EventUtil.getEvent(event);    EventUtil.stopPropagation(event);  };    var a = document.getElementById("a");  a.onclick = function(event) {    event = EventUtil.getEvent(event);    EventUtil.preventDefault(event);  };