JS获取节点的兄弟,父级,子级元素的方法

在JavaScript中，你可以通过DOM（文档对象模型）来访问和操作HTML或XML文档的各个部分。以下是一些常用的方法，用于获取节点的兄弟、父级和子级元素：

### 兄弟元素

- **nextSibling** 和 **previousSibling**：这两个属性分别获取当前节点的下一个和上一个兄弟节点（包括文本节点和注释节点）。

- **nextElementSibling** 和 **previousElementSibling**：这两个属性仅获取当前节点的下一个和上一个兄弟元素节点（忽略文本节点和注释节点）。

### 示例代码：

// 假设有一个元素 <div id="example">Example</div>
var elem = document.getElementById('example');

// 获取下一个兄弟元素
var nextElem = elem.nextElementSibling;

// 获取上一个兄弟元素
var prevElem = elem.previousElementSibling;

### 父级元素

- **parentNode**：获取当前节点的父节点。

### 示例代码：

// 假设同上
var parentElem = elem.parentNode;

### 子级元素

- **childNodes**：获取当前节点的所有子节点，包括元素节点、文本节点和注释节点。

- **children**：获取当前节点的所有子元素节点，忽略文本节点和注释节点。

### 示例代码：

// 获取所有子节点
var allChildNodes = elem.childNodes;

// 获取所有子元素节点
var allChildren = elem.children;

// 遍历所有子元素
for(var i = 0; i < elem.children.length; i++) {
    var child = elem.children[i];
    console.log(child);
}

这样，你就可以使用这些方法来访问和操作DOM中的节点了。