addEventListener - v0

Question

facade模式用于抽象添加事件。应该支持现有的IE5+。

寻找微小的改进。不需要在IE5之前提供支持。

我选择不使用图书馆。

/*addEL
**  dependencies - none 
**  browser - IE5+
**  notes - improved per answer
*/
NS.addEL = (function binding() {
    if (window.addEventListener) {
        return function addEventListener(element, type, callNow) {
            element.addEventListener(type, callNow);
        };
    }
    if (window.attachEvent) {
        return function attachEvent(element, type, callNow) {
            element.attachEvent('on' + type, callNow);
        };
    }
}());

Answer 1

• 为什么绑定有参数？闭幕式没有通过。
• 据我所知，75%的浏览器(包括IE9+)实际上支持addEventListener。如果你先检查一下attachEvent，你就是在浪费75%的保证。相反，首先检查一下addEventListener，75%的情况下，您的代码只计算一个条件。
• 为了获得更好的可读性，在命名时使用常见的约定。元素引用可以缩短为el，事件通常是ev (因为e有时引用错误对象)，事件处理程序通常称为handler或callback。
• 虽然您可能会说不支持旧的/其他浏览器，但这并不意味着您应该鲁莽地编码。在代码中，如果不支持使用attachEvent，则使用addEventListener。但是，如果浏览器也没有addEventListener怎么办？绑定将崩溃试图使用它，因为addEventListener是最后的手段，在本例中是不支持的。因此，我添加了第三种情况，这使NS.addEL成为一个函数，如果这两种方法都不可用的话，它什么也不做。

因此：

NS.addEL = (function binding(){

  if(window.addEventListener){
    return function addEventListener(el, ev, handler){
      el.addEventListener(ev, handler);
    }
  }

  if(window.attachEvent) {
    return function attachEvent(el, ev, handler){
      el.attachEvent('on' + ev, handler);
    }
  }

  return function(){/*not supported for some reason*/}

}());

另一种方法是下面的代码。它更短，但每次调用该函数时都执行检查。如果浏览器两者都不支持，那么实际上不会执行任何操作：

NS.addEL = function addEL(el,ev,handler){
  if(window.addEventListener) {
    el.addEventListener(ev,handler);
  } else if(window.attachEvent){
    el.attachEvent('on' + ev,handler);
  }
});