应优先使用 nextelementsibling/previouselementsibling；若必须用 parentnode+nextsibling，则需遍历 childnodes 并筛选 nodetype===1 的元素节点。
用 parentNode 和 nextSibling 遍历兄弟节点，核心在于：先上到父节点，再从父节点的 childNodes 列表中定位当前节点位置，进而获取前/后兄弟。但要注意，nextSibling 和 previousSibling 会包含文本节点（如换行、空格），直接使用容易出错。
理解 sibling 的真实含义
nextSibling 和 previousSibling 返回的是 DOM 树中紧邻的节点，不区分元素节点还是文本/注释节点。HTML 中的换行和缩进常被解析为 Text 节点，所以：
- 看似相邻的两个
<div>，中间可能有多个空白文本节点 <li> <code>el.nextSibling可能返回一个换行符（#text），而非你想要的下一个元素 - 建议优先使用
nextElementSibling/previousElementSibling（现代浏览器均支持） - 获取父节点：
const parent = el.parentNode - 遍历
parent.childNodes，找到当前节点的索引：Array.from(parent.childNodes).indexOf(el) - 向后找第一个
nodeType === 1（即元素节点）的节点：parent.childNodes[i + 1]开始循环判断 -
下一个兄弟元素：
el.nextElementSibling -
上一个兄弟元素：
el.previousElementSibling -
父元素：
el.parentElement（比parentNode更安全，只返回元素节点） -
nextSibling在最后一个子节点时返回null，不是undefined -
parentNode对document或document.documentElement可能为null，操作前应判空 - 动态插入节点后，
childNodes列表实时更新，但nextSibling指针不会自动重连 - 避免在循环中反复调用
el.parentNode.childNodes，可缓存引用提升性能
用 parentNode + childNodes 定位兄弟元素
如果必须用 parentNode 和 nextSibling（比如兼容老环境或学习原理），可按以下步骤安全获取“下一个元素兄弟”：
示例函数：
function nextElement(el) {
const parent = el.parentNode;
if (!parent) return null;
const children = parent.childNodes;
let i = Array.from(children).indexOf(el);
if (i === -1) return null;
for (let j = i + 1; j
更简洁可靠的替代方案
实际开发中，推荐直接使用语义明确的属性：
它们自动跳过文本、注释等非元素节点，代码更短、意图更清晰，且 IE9+ 全面支持。
注意事项与常见陷阱
使用原生 sibling 属性时需留意：
