JavaScript HTML DOM
使用 HTML DOM,JavaScript 可以访问和修改 HTML 文档中的所有元素。
HTML DOM(文档对象模型)
当网页加载时,浏览器会创建该页面的 **D**ocument **O**bject **M**odel。
**HTML DOM** 模型构建为 **对象** 树。
HTML DOM 对象树
使用对象模型,JavaScript 获得了创建动态 HTML 所需的所有功能。
- JavaScript 可以更改页面中的所有 HTML 元素。
- JavaScript 可以更改页面中的所有 HTML 属性。
- JavaScript 可以更改页面中的所有 CSS 样式。
- JavaScript 可以删除现有的 HTML 元素和属性。
- JavaScript 可以添加新的 HTML 元素和属性。
- JavaScript 可以对页面中所有现有的 HTML 事件做出反应。
- JavaScript 可以创建页面中新的 HTML 事件。
你将学到什么
在本教程的后续章节中,你将学习
- 如何更改 HTML 元素的内容。
- 如何更改 HTML 元素的样式 (CSS)。
- 如何对 HTML DOM 事件做出反应。
- 如何添加和删除 HTML 元素。
什么是 DOM?
DOM 是 W3C(万维网联盟)标准。
DOM 定义了访问文档的标准。
"W3C 文档对象模型 (DOM) 是一种与平台和语言无关的接口,允许程序和脚本动态地访问和更新文档的内容、结构和样式。"
W3C DOM 标准分为三个不同的部分
- 核心 DOM - 所有文档类型的标准模型。
- XML DOM - XML 文档的标准模型。
- HTML DOM - HTML 文档的标准模型。
什么是 HTML DOM?
HTML DOM 是 HTML 的标准 **对象** 模型和 **编程接口**。它定义了
- HTML 元素作为 **对象**。
- 所有 HTML 元素的 **属性**。
- 访问所有 HTML 元素的方法
- 所有 HTML 元素的事件
换句话说:HTML DOM 是一个标准,用于获取、更改、添加或删除 HTML 元素。