DOM

背景

要把前端研究透彻，DOM 是非常重要的一点。JavaScript 和网页的交互，绝大多数都依赖于 DOM，因此必须要弄清楚 DOM。

DOM 是什么

DOM 是 Document Object Model 的缩写。它的定义如下：

DOM 是一个跨平台的、语言独立的应用编程接口，它将 HTML/XHTML/XML 文档看作是一个树接口，在这个结构里，每个节点都是一个代表这个文档一部分的对象。这些对象可以被编程操作并且任何作为结果的视觉变化接下来都会被反映到文档的外观上。

DOM 的相关概念

Event

我在网上查阅了很多资料，也没有弄清楚 DOM 和 Event 的关系。谁产生的 Event，产生 Event 的这个主体和 DOM 又有什么关系，好多问题都不明白。
W3C 的这篇文章解释的还是比较详细，有时间仔细读一下。这篇文章也不错。

Wiki 的定义如下：

DOM events 允许事件驱动的语言，如 JavaScript、JScript、ECMAScript、VBScript 和 Java 用来在一个 DOM 树的元素节点上注册不同的事件处理器/监听器。

对于这个解释我很不满意，有以下困惑：

• Event 是模型吗，还是对象。模型（Model）又是什么；
• Event 是由谁产生的；
• Event 和 DOM 以及当前的节点到底是什么关系；
• Event 到底是怎么产生的。以按钮的点击事件为例，当我点击 btn 这个按钮的时候，click 事件是谁产生的，怎么传播的，哪里规定的按钮可以根据鼠标的点击产生 click 事件，不同元素可以产生的事件在哪里能查询到；

Event 对象

Event 对象提供了关于特定事件的很多信息，包括目标元素、按下的键、按下的鼠标按钮、鼠标位置等等信息。可惜，在这个领域有很多不同浏览器的不兼容性。

Event 处理模型

用于处理事件的模型。DOM Level 0 分为行内模型和传统模型。DOM Level 2 引入了更灵活的事件处理模型。