1.事件模型

(1)原始事件模型

直接给元素绑定事件，只处理当前元素的事件，无事件传递。

(2)IE事件模型

冒泡模型

(3)W3C事件模型

捕获模型+冒泡模型

a.捕获阶段

从document向上（到触发事件的元素方向）传递事件，遇到注册事件就执行。

b.目标阶段

到达触发事件的元素位置，执行事件处理函数。

c.冒泡阶段

从事件触发元素向document方向上传递事件，玉带注册事件就执行。

2.event对象

在W3C规范中，event对像随事件处理函数传入，Chrome FireFox Opera Safari IE9及IE+都支持。IE8及IE8-，event是window对象的一个属性。考虑到兼容性时，如下代码：

var event = event || window.event;

event对象属性：

(1)screenX/screenY(+W3C +IE)

距离显示器左/上位置。

(2)clientX/clientY(+W3C +IE)

距离可视区域左/上位置。

(3)pageX/pageY(-W3C -IE)

距离页面左/上位置。

(4)offsetX/offsetY(-W3C +IE)

距离具有定位属性的父元素的左/上位置。

(5)target(+W3C -IE),srcElement(-W3C +IE)

触发事件的目标元素。

(6)currentTarget(+W3C -IE)

当前处理事件的元素。

(7)preventDefault()(+W3C -IE)

阻止事件的默认行为。

(8)stopPropagation()(+W3C -IE) cancelBubble(-W3C +IE)

阻止事件捕获和冒泡。

 3.事件绑定与解除

(1)原始事件

绑定：

elem.type = observer;

解除：

elem.type = null;

(2)IE

绑定：

elem.attachEvent('type',observer);

解除：

elem.detachEvent('type',observer);

(3)W3C

绑定：

elem.addEventListener('type',observer,isUseCapture);

解除：

elem.removeEventListener('type',observer,isUseCapture);