JavaScript - 文档对象模型 (DOM)
HTML DOM 允许 JavaScript 访问和修改 HTML 元素的内容。JavaScript 可以更改页面中的所有 HTML 元素、属性和 CSS 样式。JavaScript 还可以添加或删除 HTML 元素和属性。使用 JavaScript，我们甚至可以在页面中创建新事件。
每个网页都驻留在浏览器窗口中，而浏览器窗口可以被视为一个对象。
Document 对象表示在该窗口中显示的 HTML 文档。Document 对象具有各种引用其他对象的属性，这些属性允许访问和修改文档内容。
什么是 DOM?
DOM 是文档对象模型 (DOM) 的缩写。它是 Core、XML 和 HTML DOM 的编程接口。
它是 W3C(万维网联盟)标准。
DOM 定义了网页或文档的逻辑结构或树状结构。在树中，每个分支都以一个节点结尾，每个节点都包含对象。DOM 方法允许我们以编程方式访问树。使用 DOM 方法，您可以更改文档的结构、内容或样式。
什么是 HTML DOM?
HTML 创建网页的结构，而 JavaScript 通过操作 HTML 元素为网页添加交互。
JavaScript 无法直接与 HTML 元素交互。因此，每当网页在浏览器中加载时，它都会创建一个 DOM。
因此，document 对象代表在该窗口中显示的 HTML 文档。此外，网页中的每个 iframe 都会创建一个新的 DOM。 Document 对象具有各种属性，这些属性引用其他对象，允许访问和修改文档内容。
访问和修改文档内容的方式称为文档对象模型，或DOM。对象按层次结构组织。这种层次结构适用于 Web 文档中对象的组织。
Window 对象 − 它代表浏览器的当前窗口。它也可用作浏览器窗口的全局对象。它位于层次结构的顶部，是对象层次结构中最外层的元素。
Document 对象 − 加载到窗口中的每个 HTML 文档都会变成一个 document 对象。该 document 包含页面的内容。它用于访问和修改网页元素。
Form 对象 − 包含在 <form>...</form> 中的所有内容标签设置表单对象。
表单控制元素 − 表单对象包含为该对象定义的所有元素，例如文本字段、按钮、单选按钮和复选框。
以下是一些重要对象的简单层次结构 −
现有多种 DOM。以下部分将详细解释每种 DOM，并描述如何使用它们来访问和修改文档内容。
旧版 DOM − 这是 JavaScript 语言早期版本中引入的模型。所有浏览器都支持该模型，但仅允许访问文档的某些关键部分，例如表单、表单元素和图像。
W3C DOM − 此文档对象模型允许访问和修改所有文档内容，并由万维网联盟 (W3C) 标准化。几乎所有现代浏览器都支持此模型。
根据 W3C 标准，DOM 有三种不同的类型。
核心 DOM − 它是所有文档类型的标准模型。
HTML DOM − 它是 HTML 文档的标准模型。
XML DOM − 它是 XML 文档的标准模型。
为什么需要 DOM?
如上所述，当网页加载到浏览器窗口时，它就变成了一个文档对象。
之后，JavaScript 可以访问 HTML 元素并对其执行其他操作。这意味着 JavaScript 可以使用 HTML DOM 与网页交互。
例如，JavaScript 可以使用 document 对象对 HTML 元素执行以下操作。
访问 HTML 元素
替换 HTML 元素
添加新的 HTML 元素
删除 HTML 元素
更改 HTML 元素的 CSS
更改 HTML 元素的属性
为 HTML 元素添加动画
为 HTML 元素添加事件
但是，document 对象还有其他用途，我们将在接下来的章节中介绍。
DOM 接口
DOM 接口是 DOM 的实际组件，它们与 JavaScript 或任何其他编程语言配合使用来操作网页。它们提供各种方法和属性来与网页交互和操作网页。
DOM 接口列表如下:
