JavaScript Event学习第八章：事件的顺序

核心提示： element1的事件处理程序会先执行，element2后执行，JavaScript Event学习第八章：事件的顺序(2)，事件冒泡但你使用事件冒泡的时候1/\<br>---||-<br>|element1|||<br>|---||---|<br>

element1的事件处理程序会先执行，element2后执行。

事件冒泡

但你使用事件冒泡的时候

1　/　\<br>---------------|　|-----------------<br>|　element1　　　　　　|　|　　　　　　　　　　　　　　　　|<br>|　　　----------　-|　|-----------　　　　　|<br>|　　　|element2　　|　|　　　　　　　　　　　　　　　|　　　　　|<br>|　　　-------------------------　　　　　|<br>|　　　　　　　　Event　BUBBLING　　　　　　　　　　　|<br>-----------------------------------<br>

element2的事件处理程序会先执行，element1的事件处理程序后执行。

W3C模式

W3C决定在这场战争中保持重力。在W3C事件模型中任何事件发生都是首先被捕获直到到达目标元素，然后再冒泡。

1　|　|　　/　\<br>-----------------|　|--|　|-----------------<br>|　element1　　　　　　　　　|　|　　|　|　　　　　　　　　　　　　　　　　　　　　|<br>|　　　-----------　--|　|--|　|-----------　　　　　|<br>|　　　|element2　　　　　\　/　　|　|　　　　　　　　　　　　　　　|　　　　　|<br>|　　　--------------------------------　　　　　|<br>|　　　　　　　　W3C　event　model　　　　　　　　　　　　　　　　　|<br>------------------------------------------<br>

作为设计师的你，可以随意选择把事件处理程序注册在捕获还是冒泡阶段。通过之前高级模式里面介绍的addEventListener()方法就可以完成。如果最后一个参数是true那么就设置成为事件捕获，如果是false就设置为事件冒泡。

编缉推荐阅读以下文章

• JavaScript Event学习补遗：addEventSimple
• JavaScript Event学习第十一章：按键的检测
• JavaScript Event学习第十章：一些可替换的事件对
• JavaScript Event学习第九章：鼠标事件
• JavaScript Event学习第七章：事件属性
• JavaScript Event学习第六章：事件的访问
• JavaScript Event学习第五章：高级事件注册模型
• JavaScript Event学习第四章：传统的事件注册模型
• JavaScript Event学习第三章：早期的事件处理程序
• JavaScript Event学习第二章：Event