如何在第一次nextSibling之后获取nextSibling？

Question

我们可以运行下面的代码

str.parentNode.nextSibling.tagName

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

str.parentNode.childNodes[3].tagName

是不是不工作？有什么解决方案吗？

Answer 1

请注意，元素的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
}

Answer 2

childNodes[3]将返回parentNode的第四个子级，而不是它的第二个下一个同级。

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

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