JavaScript DOM 父子节点常用属性

在JavaScript中，DOM（文档对象模型）表示HTML文档的层次结构。DOM提供了一组属性和方法，用于访问和操作HTML元素。

在DOM中，元素之间可以有父子关系。每个元素都有若干子元素和一个父元素（除了根元素）。常用的父子节点属性包括父节点（parentNode）、子节点（childNodes）和子元素（children）。

1. parentNode:
   • parentNode属性返回指定元素的父节点。
   • 如果元素没有父节点（例如根元素），parentNode属性返回null。
   • 通过parentNode属性，可以获取到元素的直接父节点。

// 获取元素的父节点
const parent = element.parentNode;

1. childNodes:
   • childNodes属性返回包含指定元素所有子节点的NodeList对象。
   • NodeList对象类似于数组，可以通过下标访问每个子节点。
   • 子节点包括元素节点、文本节点、注释节点等。
   • 注意：childNodes属性返回的NodeList对象是动态的，即当DOM结构发生改变时，NodeList对象也会相应更新。

// 获取元素的所有子节点
const childNodes = element.childNodes;

1. children:
   • children属性返回包含指定元素所有子元素的