获取没有 HTML 标签的文本答案

【问题标题】：Get the text without the HTML tags获取没有 HTML 标签的文本
【发布时间】：2020-09-18 11:52:41
【问题描述】：

我正在从 Wordpress api 返回帖子，目前正在获取一个包含帖子的数组。我可以返回一个字符串，但它包含 HTML 标记。我用过 textContent 和 innerText 但似乎没有用。

我目前正在返回 info: 111, key: fdfd , city: , suburb: , job: 

在没有 和  的情况下返回内容的最佳方法是什么？

【问题讨论】：

【解决方案1】：

您需要将字符串转换为 HTML 页面，然后定位“p”元素并提取其文本。比如：

var p = "<p> info: 111,<br /> key: fdfd ,<br /> city: ,<br /> suburb: ,<br /> job:  </p>"
var parser = new DOMParser();
var htmlDoc = parser.parseFromString(p, 'text/html');
console.log(htmlDoc.body.getElementsByTagName("P")[0].innerText);

【讨论】：

【解决方案2】：

您的问题已经得到解答：


function extractContent(s) {
  var span = document.createElement('span');
  span.innerHTML = s;
  return span.textContent || span.innerText;
};
    
alert(extractContent("<p>Hello</p><a href='http://w3c.org'>W3C</a>"));

原始问题： Extract the text out of HTML string using JavaScript

【讨论】：

应该将其标记为重复。正如 Lain 所描述的，innerHTML 也不是推荐的做法。

【解决方案3】：

这更像是对另一种常见方式的警告。

ATD 提到的DOMParser() 的常见替代方法是创建一个元素，将其添加为innerHTML，然后使用textContent 获取它。

let tParser = document.createElement('div');
tParser.innerHTML = "<p> info: 111,<br /> key: fdfd ,<br /> city: ,<br /> suburb: ,<br /> job:  </p>";
console.log(tParser.textContent)

但请注意使用 innerHTML 所隐含的风险。一切都被解释为 HTML 并从您的站点执行。这意味着，不要将它添加到 DOM 中，或者更好地尝试完全避免它。

此外，MDN 提到以下内容：

如果您的项目需要接受任何形式的安全审查，使用 innerHTML 很可能会导致您的代码被拒绝。例如，如果您在浏览器扩展中使用 innerHTML 并提交 addons.mozilla.org 的扩展，它不会通过自动化审查过程。

Source

【讨论】：