js 实现siblings

实现 siblings 方法

在 JavaScript 中，siblings 方法用于获取当前元素的所有兄弟元素（不包括自身）。原生 JavaScript 并未直接提供此方法，但可以通过组合 DOM 操作实现。

使用 parentNode 和 children 属性

通过获取父元素的所有子元素，再过滤掉当前元素本身：

function siblings(element) {
    const children = element.parentNode.children;
    return Array.from(children).filter(child => child !== element);
}

使用 previousSibling 和 nextSibling 遍历

通过遍历前一个和后一个兄弟节点，收集所有非文本节点的元素：

function siblings(element) {
    const siblings = [];
    let sibling = element.previousSibling;

    while (sibling) {
        if (sibling.nodeType === 1) {
            siblings.push(sibling);
        }
        sibling = sibling.previousSibling;
    }

    sibling = element.nextSibling;
    while (sibling) {
        if (sibling.nodeType === 1) {
            siblings.push(sibling);
        }
        sibling = sibling.nextSibling;
    }

    return siblings;
}

使用 jQuery 的 siblings 方法

如果项目中已引入 jQuery，可以直接使用其内置方法：

$(element).siblings();

注意事项

• 上述方法返回的是元素数组，可以根据需要进一步操作。
• 如果需要包含文本节点或其他类型节点，需调整过滤条件（如 nodeType === 3 为文本节点）。
• 性能上，parentNode.children 的方式通常更高效。