📜  DOM 中的节点是什么 - Javascript (1)

📅  最后修改于: 2023-12-03 14:40:51.467000             🧑  作者: Mango

DOM 中的节点是什么 - Javascript

在 Javascript 中,DOM (文档对象模型)中的节点是指文档中的所有元素、属性、文本、注释等。它们可以通过 DOM API 进行创建、查询、添加、删除等操作。

节点类型

DOM 中的节点类型有多种,常见的有以下几种:

  • 元素节点(Element):文档中的标签,如 <div><p> 等,可以包含子节点和属性;
  • 文本节点(Text):元素节点中的文本内容;
  • 属性节点(Attribute):元素节点的属性,如 idclass 等;
  • 注释节点(Comment):文档中的注释,如 <!-- 注释内容 --> 等。
节点属性

每个节点都有一些基本属性,可以通过 DOM API 进行访问和修改,常用属性如下:

  • nodeName:节点名称,如元素节点的标签名、文本节点的 #text 等;
  • nodeType:节点类型,如元素节点的 1、文本节点的 3 等;
  • nodeValue:节点值,如文本节点的内容、注释节点的注释内容等;
  • childNodes:子节点列表,可以通过该属性访问该节点的所有子节点;
  • parentNode:父节点,可以通过该属性访问该节点的父节点;
  • attributes:属性列表,可以通过该属性访问元素节点的所有属性。
节点操作

在 DOM 中,可以通过以下 API 对节点进行操作:

  • createElement:创建元素节点;
  • createTextNode:创建文本节点;
  • createAttribute:创建属性节点;
  • createComment:创建注释节点;
  • appendChild:添加子节点;
  • insertBefore:添加指定位置的子节点;
  • removeChild:移除指定的子节点;
  • replaceChild:替换指定的子节点;
  • setAttribute:设置元素节点的属性;
  • getAttribute:获取元素节点的属性。
总结

DOM 中的节点是文档中的所有元素、属性、文本、注释等,它们可以通过 DOM API 进行创建、查询、添加、删除等操作。掌握 DOM 中节点的属性及操作方法可以帮助我们更好地操作文档中的各种元素和内容。