javascript - 在 Javascript 中从 HTML 中提取文本的更好方法

Question

我正在尝试使用 container.innerText || container.textContent 从 HTML 字符串中抓取文本哪里container是我要从中提取文本的元素。

通常，我要提取的文本位于 <p>标签。以下面的 HTML 为例:

<div id="container">
    <p>This is the first sentence.</p>
    <p>This is the second sentence.</p>
</div>

使用

var container = document.getElementById("container");
var text = container.innerText || container.textContent; // the text I want

将返回This is the first sentence.This is the second sentence.第一个句号和第二个句子开头之间没有空格。

我的总体目标是使用斯坦福 CoreNLP 解析文本，但它的解析器无法检测到这是 2 个句子，因为它们没有用空格分隔。有没有更好的方法从 HTML 中提取文本，以便句子之间用空格字符分隔？

我正在解析的 HTML 将在 <p> 中包含我想要的大部分文本。标签，但 HTML 也可能包含 <img> , <a> ，以及嵌入在 <p> 之间的其他标签标签。

Answer 1

作为一个肮脏的黑客，尝试使用这个:

container.innerHTML.replace(/<.*?>/g," ").replace(/ +/g," ");

这会将所有标签替换为空格，然后将多个空格折叠为一个空格。

请注意，如果属性值内有 >，这会让您陷入困境。避免这个问题需要更精细的解析，例如循环所有文本节点并将它们放在一起。

<小时/>

更长但更稳健的方法:

function recurse(result, node) {
    var c = node.childNodes, l = c.length, i;
    for( i=0; i<l; i++) {
        if( c[i].nodeType == 3) result += c.nodeValue + " ";
        if( c[i].nodeType == 1) result = recurse(result, c[i]);
    }
    return result;
}
recurse(container);

假设我没有犯一个愚蠢的错误，这将对文本节点执行深度优先搜索，并将其内容附加到结果中。