跨浏览器的事件对象

记录一下跨浏览器事件处理程序,我们都知道IE和Netscape 提出的事件流是相反的,IE是事件冒泡流,而Netscape 是事件捕获流。导致一些老的浏览器的一些差异。为了兼容不同浏览器的事件对象,一般采用向下兼容的方式来处理,这里来记录一下,写法主要参考红宝书。

const 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;
        }
      },
      getEvent:function(event){
          return event?event:window.envent
      },
      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
          }
      }
    };

你可能感兴趣的:(跨浏览器的事件对象)