您的位置：首页 > Web前端 > JavaScript

JavaScript(十八) Dom Event 一

2008-04-24 11:51 120 查看

事件发生的顺序(也就是事件流)是IE4.0与Netscape4.0在事件支持上的主要差别

IE的事件处理机制

IE上事件的解决方案是绰号为冒泡(dubbed bubbling)的技术,冒泡型事件的基本思想是,事件按照从最特定的目标到最不特定的目标(document对象)的顺序触发,例如如果有下面的页面

<html>

<head></head>

<body onclick="handleClick()">

<div onclic="handleClick()">Click Me!</div>

</body>

</html>
如果用户使用IE5.5点击则事件按照以下顺序"冒泡" div -> body -> document 流程的方法之所以被称为冒泡,因为事件是按照DOM层次象水泡一样不断的上升到顶端. 在IE6中, html元素也可以接受到冒泡的事件. 如果不确定用户用的是IE5.5还是IE 6.0,最好避免在的<HTML/>元素级别上处理事件.

Netscape Navigator 的事件处理机制

IE 4.O 使用冒泡(dubbed bubbling)型事件,相对的Netscape Navigator 4.0 使用了另一种称为捕获型事件 (event capturing )的解决方案.事件的捕获和冒泡刚好是相反的两种过程捕获型事件: 事件从最不精确的对象(document)开始触发,然后到最精确) 再次使用前面的例子,如果用户点击
元素,事件按照下面的路径传播. documen -> div

DOM 事件流

DOM同时支持两种事件流,捕获型和冒泡型事件.但是捕获型事件先发生.两种事件流会触及DOM中的所有对象. 从document对象开始,也在document对象结束(大部分兼容的游览器回继续将事件的捕获/冒泡延续到window对象)

再考虑前面的例子，

事件流为: window -> document -> body -> div -> div -> body -> document -> window

1 2 3 4 5 6 7 8

(前面4个事件为捕获过程,后面的为冒泡过程) 注意因为事件的目标(元素),是最精确的元素(于是，在DOM树中最深),是上他会接收两次事件,一次在捕获过程中, 另一次在冒泡过程中。

DOM事件模型最独特的性质是,文本节点也会触发事件(IE中不会),所以如果点击例子中的文本Click Me,实际的事件流, 应该为以下:

window -> document -> body -> div -> (text) -> div ->body -> document -> window

1 2 3 4 5 6 7 8 9

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航