文档对象模型 (DOM) 概念背后的真正想法是什么？答案

【问题标题】：What is the real idea behind the concept of Document Object Model (DOM)?文档对象模型 (DOM) 概念背后的真正想法是什么？
【发布时间】：2011-05-19 03:10:21
【问题描述】：

我是 HTML 和 HTML5 的初学者。
当我阅读以下link 时，我发现了DOM 和DOM API 这两个术语。我通读了维基百科，但无法消化其背后的整个想法。

谁能解释一下：

文档对象模型 (DOM) 概念背后的真正想法？
它与 HTML5 有什么关系？

谢谢，
森

【问题讨论】：

Confused by relation between DOM and HTML (APIs)的可能重复
@David：我认为上述stackoverflow链接中只讨论了问题的第二部分。

标签： dom html

【解决方案1】：

来自Wikipedia：

文档对象模型 (DOM) 是一个跨平台和独立于语言的约定代表并与之互动 HTML、XHTML 和 XML 中的对象文件

简单地说，这就是浏览器（以及其他客户端）表示 Web 文档的方式。 DOM 并非特定于 HTML5。它从一开始就在那里。

DOM API 基本上意味着作为程序员的您如何与 DOM 交互。一些示例可能是向 DOM 添加元素、更改它们的样式以及您将在 Web 文档上执行的其他常见操作。

在HTML5 的上下文中，DOM 有几个在以前版本的HTML 规范中不存在的新增内容，例如<video> 和<audio> 元素。

【讨论】：

【解决方案2】：

DOM 是浏览器对 HTML 文档的内部表示。
DOM API 是编程 DOM 的方式，在浏览器中使用 JavaScript。
HTML5 只是一种新的 HTML。它以完全相同的方式使用 DOM。

Mark Pilgrim 的意思是，您可以通过 DOM API 对 HTML5 DOM 元素执行某些操作，例如开始播放视频文件。所以，如果你在 JavaScript 中有一个 <video> DOM 对象，你可以从 JavaScript 中调用它的 .play() 方法。这是 DOM API 的一个示例。

【讨论】：

【解决方案3】：

文档对象模型是浏览器对 HTML 的内部表示。它基于“孩子”的概念。所以一个标签可能包含几个文本节点和几个标签，像这样：

<p><span>Hello,</span> this is some text. <span>It</span> is just a short paragraph</p>

这个标签有4个子标签：两个s和两个文本节点（this is some text和is just a short paragraph）。其他文本位是它们各自  标记的子级。

浏览器将这些信息存储在它的内部存储器中（而不是仅仅存储一个非常难以处理的巨大的 HTML 流）。这使得使用层叠样式表 (CSS) 对其进行格式化和使用 JavaScript 对其进行更改（创建和删除部件、将部件从一个父级移动到另一个父级等）变得更加容易。

所有版本的 HTML（可能除了早期版本）都使用 DOM。每个版本都有规则，例如哪些标签是有效的，哪些可以是每个元素的子元素。这些规则在处理 HTML 并创建它的 DOM 表示时实现。

【讨论】：

【解决方案4】：

dom是程序对象的html表示，每个网页都是DOM对象的集合

【讨论】：