DOM级别

DOM0

通过元素的事件属性（onclick）来进行绑定处理函数

// 绑定事件
document.getElement('btn').onclick = function() {

}
// 解绑
document.getElement('btn').onclick = null

DOM2(DOM标准中没有定义DOM1)

通过addEventLinstner来绑定处理函数。

解决了DOM0不能同时绑定多个处理函数的缺点

// 绑定
document.getElement('btn').addEventListner('click', func1)
document.getElement('btn').addEventListner('click', func2)
// 解绑
document.getElement('btn').removeEventListner('click')

DOM3

添加了更多的事件

• UI事件：load、srcoll
• 焦点事件：blur、focus
• 滚轮事件：mounsewheel
• 文本事件：textInput
• 键盘事件：keydown、keypress
• 合成事件
• 变动事件：DOMsubtreeModified
• 自定义事件

DOM事件流

image

• 事件的三个阶段