Question

我正在尝试创建一个脚本来获取文档的所有部分，并创建一个导航，其中包含链接的ID和H2作为链接文本。我尝试了几种方法，标题未定义。我尝试使用类，获取第一个子节点，并将节点列表转换为数组。

http://codepen.io/brooksroche/pen/XmpNaq?editors=101

if (document.getElementsByClassName("doc-section")) {
  var sections = document.getElementsByClassName("doc-section"),
    sidebar = document.getElementById('sidebarNav'),
    navLinks = "";
  for (var i = 0; i < sections.length; ++i) {
    var current = sections[i],
      anchorID = current.id,
      title = current.childNodes[0].text,
      navLink = '<li><a href="#' + anchorID + '">' + title + '</a></li>',
      navLinks = navLinks + navLink;
  }
  if (sidebar) {
    sidebar.innerHTML = navLinks;
  }
}

Answer 1

使用此代码（收集标题时）：

title = current.children[0].textContent

Demo。换句话说，您应该放置children而不是childNodes，因为后者会收集元素和文本节点。引用the docs：

childNodes还包括例如文本节点和注释。要跳过它们，请改用ParentNode.children。

在这种特殊情况下，结束标记和开始标记之间的空格实际上是section元素的第一个childNode。您可以使用.data属性获取其文本，但显然没有用。

实际上，您可能会认为这是一个更安全的选择：

title = current.querySelector('.sectionTitle').textContent

...这样当相应元素的顺序发生变化时，你仍然可以从中收集文本（当然，如果类是相同的话）。

如何在for循环中获取第一个childnode

1 个答案: