1、事件流
事件流描述的是从页面中接收事件的顺序。但是IE提出的是冒泡流，而Netscape Communicator提出的是捕获流。
JavaScript事件流
2、事件冒泡（event bubbling）
事件开始由最具体的元素（嵌套层次最深的那个节点）接收，然后逐级向上传播为较不为具体的节点（文档）。如下：
代码如下:
<html>
<head>
<title>事件冒泡</title>
</head>
<body>
<div id=”myDiv”>点击我</div>
</body>
</html>
wi
JavaScript的事件机制是Web开发中不可或缺的一部分，它允许开发者对用户与网页的交互进行响应。在本文中，我们将深入探讨事件流、事件冒泡以及如何阻止事件冒泡和取消默认事件。
1. **事件流**
事件流描述了事件在DOM（文档对象模型）中的传播路径。主要有两种模式：
- **冒泡流（Bubble Phase）**：事件从最具体的元素（即嵌套最深的节点）开始，然后逐级向上层元素传播，直到到达DOM树的根节点，也就是文档对象。
- **捕获流（Capture Phase）**：与冒泡流相反，事件首先由最不具体的节点（即文档）接收，然后向下传播到最具体的节点。
JavaScript中的事件流实际是结合了这两种模式。W3C标准建议使用捕获流，但IE最初仅支持冒泡流。现代浏览器普遍支持两种模式，通常事件默认从捕获阶段开始，然后进入冒泡阶段。
2. **事件冒泡（Event Bubbling）**
如代码示例所示，当用户点击`<div id="myDiv">点击我</div>`时，事件会按照`div -> body -> html -> document`的顺序逐级冒泡。在IE5.5之前的版本中，事件会直接从`body`跳到`document`，而在Firefox、Chrome和Safari中，事件会冒泡到`window`对象。
3. **阻止事件冒泡**
阻止事件冒泡意味着不让事件继续向父元素传递。这可以通过调用`event.stopPropagation()`（非IE浏览器）或设置`window.event.cancelBubble = true;`（IE浏览器）来实现。例如：
```javascript
function stopBubble(e) {
if (e && e.stopPropagation) {
e.stopPropagation();
} else {
window.event.cancelBubble = true;
}
}
```
在事件处理函数中调用`stopBubble(e)`即可阻止当前事件的冒泡。
4. **取消默认事件**
取消默认事件是指阻止浏览器对特定事件的默认响应。例如，点击链接时默认行为是跳转，我们可能希望阻止这个行为。这可以使用`event.preventDefault()`（非IE）或设置`window.event.returnValue = false;`（IE）实现。示例：
```javascript
function stopDefault(e) {
if (e && e.preventDefault) {
e.preventDefault();
} else {
window.event.returnValue = false;
}
return false; // 对于旧版IE，返回false也可以阻止默认行为
}
```
总结，理解JavaScript的事件流、事件冒泡以及如何阻止这些行为对于编写交互丰富的网页至关重要。通过正确使用这些技术，开发者可以精确控制用户与网页的交互，提供更优质的用户体验。
