javascript - 将textNode内容转换为字符串

Question

我无法将 textNode 转换为字符串的问题。 我正在尝试抓取一个站点并从中获取某些信息，当我使用 XPath 查找此文本时，我在获取一个 textNode 之后。 当我在 chrome 中查看谷歌开发工具时，我可以看到 textNode 本身包含我想要的文本，但是如何将 textNode 转换为纯文本？

这是我使用的代码行:

abstracts = ZU.xpath(doc, '//*[@id="abstract"]/div/div/par/text()');

我尝试过使用 .innerHTML、toString、textContent 之类的东西，但到目前为止没有任何效果。

Answer 1

如果我想查看 textNode 的内容字符串，我通常使用 Text.wholeText，因为 textNode 是一个对象，所以使用 toString 或 innerHTML 将不起作用，因为它是一个对象而不是字符串本身......

示例: 来自 https://developer.mozilla.org/en-US/docs/Web/API/Text/wholeText

Text.wholeText 只读属性返回逻辑上与该节点相邻的所有 Text 节点的全文。文本按文档顺序连接。这允许指定任何文本节点并将所有相邻文本作为单个字符串获取。

语法

str = textnode.wholeText;

注释和示例: 假设您的网页中有以下简单段落(在此处的代码示例中添加了一些空格以帮助格式化)，其 DOM 节点存储在变量 para 中:

<p>Thru-hiking is great!  <strong>No insipid election coverage!</strong>
However, <a href="http://en.wikipedia.org/wiki/Absentee_ballot">casting a
ballot</a> is tricky.</p>

你决定你不喜欢中间的句子，所以你删除它:

para.removeChild(para.childNodes[1]);

后来，您决定将事情改写为:“徒步旅行很棒，但投票很棘手。”同时保留超链接。所以你试试这个:

para.firstChild.data = "Thru-hiking is great, but ";

一切就绪，对吧？错误的!发生的事情是你删除了 strong 元素，但是删除的句子的元素分隔了两个文本节点。一个用于第一个句子，一个用于最后一个单词的第一个单词。相反，您现在有效地拥有了:

<p>Thru-hiking is great, but However, <a
href="http://en.wikipedia.org/wiki/Absentee_ballot">casting a
ballot</a> is tricky.</p>

您真的更愿意将所有这些相邻的文本节点视为一个单独的节点。这就是 wholeText 的用武之地:如果您有多个相邻的文本节点，您可以使用 wholeText 访问所有这些节点的内容。假设您从未犯过最后一个错误。在这种情况下，我们有:

assert(para.firstChild.wholeText == "Thru-hiking is great!    However, ");

wholeText 只是文本节点的一个属性，它返回构成所有相邻(即未被元素边界分隔)文本节点组合的数据字符串。

现在让我们回到最初的问题。我们想要的是能够用新文本替换整个文本。这就是 replaceWholeText() 的用武之地:

para.firstChild.replaceWholeText("Thru-hiking is great, but ");

我们将删除每个相邻的文本节点(所有构成整个文本的节点)，但调用 replaceWholeText() 的节点除外，我们将剩余的节点更改为新文本。我们现在拥有的是:

<p>Thru-hiking is great, but <a
href="http://en.wikipedia.org/wiki/Absentee_ballot">casting a
ballot</a> is tricky.</p>

使用 Node.textContent 或长期存在的 Element.innerHTML 可能会更好地满足全文本功能的某些用途；这很好，在大多数情况下可能更清楚。如果您必须在一个元素中处理混合内容，如此处所示，wholeText 和 replaceWholeText() 可能会有用。

更多信息:https://developer.mozilla.org/en-US/docs/Web/API/Text/wholeText