事件的绑定

方式一：直接绑定

var btn = document.getElementsByTagName("button")[0];
btn.onclick = function () {
    console.log("1");
}

注意:该方式绑定的事件，后来的会覆盖掉以前的。
方式二：addEventListener

btn.addEventListener("click",fn1);
function fn1(){
    console.log("1");
}

注意:该方式绑定的事件，后来的不会覆盖掉以前的。

添加事件的兼容性写法

EventListen = {
        addEvent: function (ele,fn,str) {
            //通过判断调用的方式兼容IE678
            //判断浏览器是否支持该方法，如果支持那么调用，如果不支持换其他方法
            if(ele.addEventListener){
                //直接调用
                ele.addEventListener(str,fn);
            }else if(ele.attachEvent){
                ele.attachEvent("on"+str,fn);
            }else{
                //在addEventListener和attachEvent都不存在的情况下，用此代码
                ele["on"+str] = fn;
            }
        }
    }

解绑事件的兼容性写法

EventListen = {
    addEvent: function (ele,fn,str) {
        //通过判断调用的方式兼容IE678
        //判断浏览器是否支持该方法，如果支持那么调用，如果不支持换其他方法
        if(ele.addEventListener){
            //直接调用
            ele.addEventListener(str,fn);
        }else if(ele.attachEvent){
            ele.attachEvent("on"+str,fn);
        }else{
            //在addEventListener和attachEvent都不存在的情况下，用此代码
            ele["on"+str] = fn;
        }
    },
    removeEvent: function (ele,fn,str) {
        if(ele.removeEventListener){
            ele.removeEventListener(str,fn);
        }else if(ele.detachEvent){
            ele.detachEvent("on"+str,fn);
        }else{
            ele["on"+str] = null;
        }
    }
}