关于html:js封装html事件绑定通用类

因为浏览器中有些品牌及型号有非凡的存在，有些办法不反对，这种事件就很让人头疼。比方在测试的时候，在谷歌浏览器好使，在 IE 下就不好使
caniuse 网站中就能查到 api 在浏览器反对状况

addEventListener 在 IE6- 8 中就不反对

stopPropagation 在 IE6- 8 中也不反对

preventDefault 有些浏览器反对状况还存在疑难
这种状况下有必要封装一个通用类及公共办法来反对此类事件。addEventListener和 removeEventListener 须要独自封装成一个类，实现比较简单，就是对该元素是否存在办法进行判断，如果存在就挂载，切实没有就手动挂载一个办法

class BomEvent {constructor(element) {this.element = element;}

  addEvent(type, handle) {if (this.element.addEventListener) {
      // 事件类型、须要执行的函数、是否捕获
      this.element.addEventListener(type, handle, false);
    } else if (this.element.attachEvent) {this.element.attachEvent("on" + type, function () {handle.call(element);
      });
    } else {this.element["on" + type] = handle;
    }
  }

  removeEvent(type, handle) {if (this.element.removeEventListener) {this.element.removeEventListener(type, handle, false);
    } else if (this.element.detachEvent) {this.element.detachEvent("on" + type, handle);
    } else {this.element["on" + type] = null;
    }
  }
}

// 阻止事件 (次要是事件冒泡，因为 IE 不反对事件捕捉)
function stopPropagation(event) {if (event.stopPropagation) {event.stopPropagation(); // 规范 w3c
  } else {event.cancelBubble = true; // IE}
}

// 勾销事件的默认行为
function preventDefault(event) {if (event.preventDefault) {event.preventDefault(); // 规范 w3c
  } else {event.returnValue = false; // IE}
}