jquery - 如何使用 jQuery 去除 HTML 标签？

Question

我想从字符串中删除 HTML 标签。例如假设我们有字符串：

 <p> example ive got a string</P>

如何编写一个函数来删除<p><p>并仅返回“示例我有一个字符串”？

Answer 1

使用.text()功能：

var text = $("<p> example ive got a string</P>").text();

更新：正如 Brilliand 在下面指出的，如果输入字符串不包含任何标签并且您很不幸，它可能会被视为 CSS 选择器。所以这个版本更加健壮：

var text = $("<div/>").html("<p> example ive got a string</P>").text();

Answer 2

最安全的方法是依靠浏览器 TextNode 来正确转义内容。这是一个例子：

function encodeHTML(dirtyString) {
  var container = document.createElement('div');
  var text = document.createTextNode(dirtyString);
  container.appendChild(text);
  return container.innerHTML; // innerHTML will be a xss safe string
}

document.write( encodeHTML('<p>some <span>content</span></p>') );
document.write( encodeHTML('<script><p>some <span>content</span></p>') );

这里要记住的是，当我们访问 html 字符串 ( innerHTML, outerHTML) 时，浏览器会转义 TextNodes 的特殊字符。相比之下，访问文本值 ( innerText, textContent) 将产生原始字符串，这意味着它们不安全并且可能包含 XSS。

如果您使用jQuery，那么 using.text()是安全且向后兼容的。请参阅此问题的其他答案。

如果您使用浏览器 <= Internet Explorer 8，纯 JavaScript 中最简单的方法是：

string.replace(/(<([^>]+)>)/ig,"");

但是使用正则表达式解析 HTML 存在一些问题，因此这不会提供很好的安全性。此外，这仅处理 HTML 字符，因此它不是完全 xss 安全的。

Answer 3

这是获取 url 图像的示例，从某些项目中转义 p 标签。

试试这个：

$('#img').attr('src').split('<p>')[1].split('</p>')[0]

Answer 4

如果你想保留元素的 innerHTML 并且只去除最外层的标签，你可以这样做：

$(".contentToStrip").each(function(){
  $(this).replaceWith($(this).html());
});

Answer 5

您可以使用现有的拆分功能

一个简单而不稳定的例子：

var str = '<p> example ive got a string</P>';
var substr = str.split('<p> ');
// substr[0] contains ""
// substr[1] contains "example ive got a string</P>"
var substr2 = substr [1].split('</p>');
// substr2[0] contains "example ive got a string"
// substr2[1] contains ""

该示例只是向您展示拆分的工作原理。