事件冒泡：ie的事件流叫事件冒泡（事件开始由最具体逐级向上传播到较为不具体的节点）
事件捕获：netscape 提出的另一种事件流叫事件捕获（不太具体的节点逐级向下传播到具体的节点与冒泡相反。）
DOM事件流
3个阶段：事件捕获阶段，处于目标阶段和事件冒泡阶段。首先发生的是事件捕获，为捕获事件提供机会，然后是实际的目标接收到事件。最后一个阶段是冒泡阶段，可以再这个阶段对事件作出响应。
事件处理程序（或事件侦听器）
定义：响应某个事件的函数。以on开头。
DOM0级事件处理程序
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>DOM0级事件处理程序</title>
</head>
<body>
<input type="button" id="myBtn" value="Click Me" />
<input type="button" id="myRemoveBtn" value="Remove Event Handler" />
<script type="text/javascript">
var btn = document.getElementById("myBtn");
btn.onclick = function(){
alert(this.id);
};
var removeBtn = document.getElementById("myRemoveBtn");
removeBtn.onclick = function(){
btn.onclick = null;//删除事件处理程序
};
</script>
</body>
</html>
DOM2级事件处理程序
定义了2个方法，用于处理制定和删除事件处理程序的操作：addEventListener()和removeEventListener()
接收三个参数：要处理的事件名，作为事件处理程序的函数， 一个布尔值。 true:表示在捕获阶段调用事件处理程序。false:表示在冒泡阶段调用。
主要好处是：可以添加多个事件处理程序。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>DOM2级事件处理程序</title>
</head>
<body>
<input type="button" id="myBtn" value="Click Me" />
<p>本实例在IE9以下的浏览器无法运行。</p>
<script type="text/javascript">
var btn = document.getElementById("myBtn");
btn.addEventListener("click", function(){
alert(this.id);
}, false);
btn.addEventListener("click", function(){
alert("Hello world!");
}, false);
</script>
</body>
</html>
相关推荐
JavaScript高级程序设计是每个前端开发者深入理解这门语言所必经之路。这篇学习笔记将带你探索JavaScript的核心概念，包括变量、数据类型、控制流、函数、对象和类等，这些都是构建复杂应用程序的基础。 首先，我们...
### HTML5高级程序设计学习笔记 #### 一、HTML5新增结构标签 在HTML5中，为了更好地组织页面内容并增强语义性，引入了一系列新的结构标签，这些标签不仅能够帮助开发者更清晰地定义页面的不同部分，同时也为搜索...
这篇"JavaScript高级程序设计 DOM基础笔记.doc"文档可能详细介绍了以上这些概念，并可能包含实例和实践建议，有助于深入理解DOM操作和JavaScript在网页中的作用。通过学习和实践，开发者能更好地控制网页行为，实现...
javacript高级程序设计的个人学习总结，涉及到很多javascript的高级特性
以上只是JavaScript高级程序设计中的一部分内容，实际的学习笔记会更深入地探讨这些主题，包括异常处理、作用域链、闭包、异步编程（如回调函数、Promise、async/await）、模块系统（CommonJS、ES modules）、正则...
这份“JavaScript高级程序设计---笔记归类.pdf”文档显然详细整理了JavaScript的关键知识点，包括ECMAScript规范、DOM操作、数据类型、运算符、流程控制语句、函数以及面向对象编程等。 首先，ECMAScript是...
这本“JavaScript高级程序设计第四版”的学习笔记涵盖了JavaScript的各个方面，旨在帮助学生、开发者以及对编程感兴趣的人深入理解这一强大的脚本语言。这份笔记是针对毕设、课设、项目实训等实践性学习场景编写的，...
1、对象再认识 （1）对象属性和特性 什么是属性（Property），什么是特性（Attribute），这有什么区别？我不想也不会从语义学上去区分，对于这系列文章来说，属性就是组成对象的一个部分，广义上也包括对象的方法...
在深入探讨JavaScript编程语言之前，...在《JavaScript高级程序设计》这本书中，作者深入探讨了这些概念，并提供了一系列实用的编程技巧和最佳实践，这对于任何希望深化JavaScript知识的开发者来说都是一份宝贵的资源。
根据给定的文件信息，以下是关于JavaScript中DOM（文档对象模型）的相关知识点详解： DOM是文档对象模型（Document Object Model）的缩写，它是一个跨平台的接口，由W3C组织制定标准，用于在HTML或XML文档中创建和...
在本节中，我们将深入探讨JavaScript的高级程序设计，特别是关注"第四章(js高级程序设计学习笔记)----2"的主题。这一章很可能涵盖了JavaScript的核心概念，包括原型链(Prototype Chaining)。通过阅读名为...
在进行JavaScript编程时，错误处理和调试是不可避免的两个重要环节。良好的错误处理机制能够帮助开发者快速定位和解决问题，而有效的调试技巧则能够帮助开发者理解和优化代码逻辑。接下来，我们将详细介绍如何在...
可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【附加价值】： 项目具有较高的学习借鉴价值，也可直接拿来修改复刻。 对于有一定基础或热衷于研究的人来说，可以在这些基础代码上进行修改和扩展，...