有没有办法选择同级节点？

javascript dom siblings

2022-08-30 04:21:01

出于某些性能原因，我正在尝试找到一种方法来仅选择所选节点的同级节点。

例如

<div id="outer">
  <div id="inner1"></div>
  <div id="inner2"></div>
  <div id="inner3"></div>
  <div id="inner4"></div>
</div>

如果我选择了 inner1 节点，有没有办法让我访问它的同级节点？inner2-4

答案 1

井。。。确定。。。只需访问父母，然后访问孩子。

 node.parentNode.childNodes[]

或。。。使用 jQuery：

$('#innerId').siblings()

编辑：克莱图斯一如既往地鼓舞人心。我挖得更远。这就是jQuery如何基本上获得兄弟姐妹的方式：

function getChildren(n, skipMe){
    var r = [];
    for ( ; n; n = n.nextSibling ) 
       if ( n.nodeType == 1 && n != skipMe)
          r.push( n );        
    return r;
};

function getSiblings(n) {
    return getChildren(n.parentNode.firstChild, n);
}

答案 2

var sibling = node.nextSibling;

这将立即返回它之后的同级，或者 null 不再有同级可用。同样，您可以使用 .previousSibling

[编辑]仔细想想，这不会给出下一个标签，而是节点后面的空格。更好的似乎是div

var sibling = node.nextElementSibling;

还存在一个 .previousElementSibling