DOM事件分0级事件和2级事件（之所以没有DOM一级事件，貌似是DOM在第一次升级的时候，并没有对事件进行修改）

DOM0级事件

DOM0级事件，就相当于给DOM元素的属性增加了属性值，console.dir 截了一部分：

里面有好多我认识的事件类型，和不认识的，不过这都没有没有关系。

// 页面中有一个id为box的盒子
var oBox=document.getElementById('box');
oBox.onclick=function(e){
    alert('hello');
}
oBox.onclick=function(e){
    alert('world')
}

点击时，肯定是只弹出‘world’，因为下面的代码已经把之前oBox的onclick属性覆盖了

DOM2级事件

DOM2级事件是JS提供的一个方法，可以理解为一个内置的事件池，通过传递参数：
param1：事件类型参数；
param2：绑定的方法,方法里还有一个
param3： false，指方法是在事件的冒泡阶段触发；true是指在捕获阶段（一般都是false）

往事件池里添加，传递的方法里，浏览器默认提供给我们一个‘事件对象’参数，里面还记录了一些信息（DOM0级事件也有事件对象）。但是，IE6-8有兼容问题

• 事件绑定方式

var fn1=function(){alert('fn1');}
var fn2=function(){alert('fn2');}
var fn3=function(){alert('fn3');}
//标准
oBox.addEventListener("click",fn1,false); 
oBox.addEventListener("click",fn1,false); 
oBox.addEventListener("click",fn2,false); 
oBox.addEventListener("click",fn3,false); 
oBox.removeEventListener('click',fn1); //解绑
//IE6-8
oBox.attachEvent("onclick",fn1);
oBox.attachEvent("onclick",fn1);
oBox.attachEvent("onclick",fn2);
oBox.attachEvent("onclick",fn3);
oBox.detachEvent('onclick',fn1);  //解绑

• 方法执行次数
  标准浏览器对于一个方法多次绑定，事件触发只执行一次；IE没有实现去重，绑几次，触发的时候执行几次。（上述例子标准浏览器只会弹一个1,2,3；IE的话就是两个1，一个2,3）

需要注意：
事件绑定的方法都是实名方法，因为匿名方法是解除不掉的。

• 执行顺序
  标准浏览器下，事件被触发执行方法的顺序就是绑定方法的顺序，IE是混乱的。（上述例子标准浏览器就是弹1,2,3；IE没准是什么顺序）

• 方法里的this指向
  标准浏览器事件触发执行函数的this指的是当前的DOM元素，而万恶的IE是window；

• 事件对象及一些属性兼容（DOM0和DOM2都有）（这个面试的时候总被问）

1. 获取事件对象：
   标准：e
   IE：window.event （以下统称为e）
2. 事件源：
   标准：e.target
   IE：e.srcElement
3. 阻止默认行为：
   标准：e.preventDefault()
   IE：e.returnValue = false
4. 阻止冒泡：
   标准：e.stopPropagation()
   IE： e.cancelBubble = true
5. 鼠标到文档的距离：
   标准：e.pageX / e.pageY
   IE：木有~，可以使用e.clientX+scrollLeft / e.clientY+scrollTop 来计算