如何在第一个nextSibling之后获得nextSibling？

Question

我们可以运行此代码

str.parentNode.nextSibling.tagName

并相应地获取名称。我们需要的是nextSibling之后的nextSibling所以我们尝试了这个

str.parentNode.childNodes[3].tagName

不工作？任何解决方案？

Answer 1

childNodes[3]将返回parentNode的第四个孩子，而非第二个下一个兄弟。

要获取该节点，您可以应用nextSibling两次：

var tagName = str.parentNode.nextSibling.nextSibling.tagName;

Answer 2

请注意，元素的nextSibling可能是文本节点，它没有 tagName 属性，或者根本不存在，在这种情况下nextSibling将会是undefined并且尝试访问其tagName属性会引发错误。

所以你可能想做类似的事情：

var nextSibling = getNextElementSibling(str.parentNode);
var tagName = nextSibling? nextSibling.tagName : ''; // or maybe undefined  

if (tagName) {
  // do stuff

} else {
  // no element sibling was found
}

并且getNextElementSibling函数类似于：

function getNextElementSibling(node) {

  while (node && (node = node.nextSibling)) {
    if (node.nodeType == 1) {
      return node;
    }
  }
  // return undefined
}