今天golang学习网给大家带来了《JavaScript-文档对象模型（DOM）》，其中涉及到的知识点包括等等，无论你是小白还是老手，都适合看一看哦~有好的建议也欢迎大家在评论留言，若是看完有所收获，也希望大家能多多点赞支持呀！一起加油学习~

DOM（文档对象模型）是Web文档的编程接口，它将HTML或XML文档的结构表示为对象树。借助DOM，开发者可以使用JavaScript与网页交互并操作网页内容。HTML DOM允许JavaScript更改HTML元素的内容、属性和样式。

在HTML页面中查找和访问HTML元素的方法：

• 通过ID查找: 例如，ID为"intro"的元素：

const element = document.getElementById("intro");

• 通过标签名查找: 例如，查找所有

  标签：

const elements = document.getElementsByTagName("p");

• 通过类名查找: 例如，类名为"intro"的元素：

const elements = document.getElementsByClassName("intro");

• 使用CSS选择器查找: querySelectorAll()方法可以查找匹配指定CSS选择器的所有HTML元素。例如，查找类名为"intro"的

  标签：

const elements = document.querySelectorAll("p.intro");

• 通过HTML集合遍历查找:

DOM中的所有内容都是节点，包括元素、文本和属性。

• 元素节点: 代表HTML或XML元素，例如：
  、

  、

  等。 例如：

Hello, world!

• 文本节点: 代表元素内的文本内容。在上面的例子中，“Hello, world!”就是一个文本节点。

创建新的HTML元素（节点）：

1. 创建元素: 使用document.createElement()方法创建HTML元素。
2. 创建文本节点: 使用document.createTextNode()方法创建文本节点。
3. 将文本添加到元素: 使用appendChild()方法将文本节点添加到新创建的元素。
4. 将元素添加到文档: 使用appendChild()方法将新创建的元素添加到文档中的某个父元素（例如，）。

示例：

更改HTML样式:

语法：document.getElementById(id).style.property = newStyle;

示例：

Payilagam

(图片描述：点击前后的样式变化)

以上就是《JavaScript-文档对象模型（DOM）》的详细内容，更多关于的资料请关注golang学习网公众号！