DOM 2 级事件
element.addEventListener(type,handler,boolean)
第一个值代表事件类型，不加on。
第二个是执行的方法。(事件处理函数)
第三个值是一个布尔值，默认为false，只在冒泡阶段执行。true为在捕获阶段执行
element.removeEventListener(type,handler,boolean)
第一个值代表事件类型，不加on。
第二个是执行的方法。(事件处理函数)
第三个值是一个布尔值，默认为false，只在冒泡阶段执行。true为在捕获阶段执行
移除事件。用法与addEventListener一致。
element.attachEvent(type,handler) IE的事件绑定。
element.detachEvent(type，handler) IE的事件移除。
第一个值代表事件类型，加on。
第二个是执行的方法。(事件处理函数),
由于IE的事件模型只有冒泡模型,所以,只用传两个值.
两种绑定的区别：ie与DOM事件绑定的区别
addEventListener():
1-事件名称不带on ;
2-同一个 节点对象 可以绑定多个 事件函数
3-执行事件函数的顺序是正序；
4-this指向 节点对象obj;
5-有捕获 当参数是true时 表示捕获 false 指冒泡 （默认）
attachEvent():
1-事件名称带on;
2-同一个 节点对象 可以绑定多个 事件函数
3-执行事件函数的顺序是倒序；
4-this指向 windoew对象; 使用函数的call()方法 改变this的指向
5-没有捕获
添加跨浏览器事件绑定
var addEvent = function(ele,type,handler){
if(ele.addEventListener){
ele.addEventListener(type,handler,false)
}else if(ele.attachEvent){
ele.attachEvent("on"+type,handler)
}else{
ele["on"+type]=handler
}
}
addEvent(btn,"click",function(){console.log("点击")})
移除跨浏览器绑定
function removeEvent(ele,type,handler){
if(ele.removeEventListener){
ele.removeEventListener(type,handler,false)
}
else if(ele.detachEvent){
ele.detachEvent('on'+type,handler)
}
else{
ele['on'+type]=null
}
}
removeEvent(btn,"click",function(){console.log("点击")})
DOM 0 级事件
HTML中的on-属性
<button id="btn" onclick="console.log(1)">确定</button>
<button id="btn" onclick="fn()">确定</button>
引号中字符的是可以执行的字符串
由于HTML中的on-方法使得js与HTML紧密的耦合在一起，不利于后期维护，所以不推荐使用。
DOM 0级事件
var btn=document.getElementById("btn")
btn.onclick=function(){
console.log(1);
}
btn.onclick=function(){
console.log(2);
}//2
如果添加相同的事件,后面的会覆盖前面的事件
