js addListener 的封装 用于给标签注册事件

在web开发中经常会用js jquery给html标记注册事件，其实就是添加监听：

由于很常用，简单封装一个代码片，需要的可以复制下去直接使用

function addListener(element, e, fn) {
    if (element.addEventListener) {
        element.addEventListener(e, fn, false);
    } else {
        element.attachEvent(e, fn);
    }
}

element：dom节点

e：event事件

fn：function方法

使用例子：

var inp = document.getElementById('inputCode');
addListener(inp, "onclick", function () {
    inp.value = "";
});
addListener(inputCode, "onblur", function () {
    inp.value = "请输入接收到的验证码";
});

html部分：

为了兼容ie它老人家，我们一般会这么写事件注册（柯里化的应用之一就是惰性加载函数，也有人叫“提前返回”）：

柯里化后的事件注册：

var addEvent = function(ele, type, fn) {
    if (window.addEventListener) {
        addEvent = function(ele, type, fn) {
            ele.addEventListener(type,fn,false);
        } 

    } else if (window.attachEvent) {
        addEvent = function(ele, type, fn) {
            ele.attachEvent(type,fn);
        } 
    }
    //执行
    addEvent(ele, type, fn);
}

当然，柯里化函数并不只是为了兼容性，还有就是我们每次使用addEvent为元素添加事件的时候，都会走一遍if...else if ...分支，其实只要一次判定就可以了，这就是惰性函数的用处了。此时函数在第一次进入分支之后，会在函数内部重写这个函数，重写的这个函数就是我们需要的addEvent函数了，下一次进入addEvent函数的时候，函数不再存在条件分支。