javascript - 有没有比一系列正则表达式搜索/替换更好的方法将 HTML 转换为 JavaScript 中的纯文本

Question

我的目标是通过 REST API 检索 HTML 并将其转换为纯文本。然后我通过另一个 API 将它发送到 Slack，它不接受 HTML(据我所知)。

我正在使用一系列 Regex 脚本来完成此任务。

var noHtml = text.replace(/<(?:.|\n)*?>/gm, '');
var noHtmlEncodeSpace = noHtml.replace(/&nbsp;/g, ' ');
var noHtmlEncodersquo = noHtmlEncodeSpace.replace(/&rsquo;/g, "'");
var noHtmlEncodeldsquo = noHtmlEncodersquo.replace(/&lsquo;/g, "'");
var noHtmlEncodeSingleQuote = noHtmlEncodeldsquo.replace(/&#39;/g, "'");
var noHtmlEncodeldquo = noHtmlEncodeSingleQuote.replace(/&ldquo;/g, "`");
var noHtmlEncodeDoubleQuote = noHtmlEncodeldquo.replace(/&quot;/g, "`");
var noHtmlEncoderdquo = noHtmlEncodeDoubleQuote.replace(/&rdquo;/g, "`"); 

结果符合预期。但是将 HTML 转换为纯文本似乎是 JavaScript 中的一项足够常见的任务，因此可能有更智能的方法来完成它。

我是 JavaScript 新手。感谢您提供任何指导。

Answer 1

您可以使用 DOMParser 将 HTML 字符串安全地解析为文档，之后您可以检索文档的 textContent:

const htmlStr = `<div>
foo &nbsp;&nbsp;  &rsquo;&rsquo;
</div>
<script>
alert('evil');
</` + `script>
<img src="badsrc" onerror="alert('evil')">`;


const doc = new DOMParser().parseFromString(htmlStr, 'text/html');
console.log(doc.body.textContent);

根据所需的文本间距，您可以改用 innerText 属性:

doc.body.innerText

(这与设置新创建元素的 innerHTML 形成对比，后者不那么安全——“邪恶”脚本可能在 之前执行textContent 被检索)