如何从 JavaScript 中的字符串中去除 HTML?
如何从 JavaScript 中的字符串中去除 HTML 标签?
IT技术
javascript
html-parsing
2021-01-13 15:58:26
4个回答
cleanText = strInputCode.replace(/<\/?[^>]+(>|$)/g, "");
此正则表达式查找<
、 可选斜杠/
、 一个或多个不是 的字符>
,然后是>
或$
(行尾)
例子:
'<div>Hello</div>' ==> 'Hello'
^^^^^ ^^^^^^
'Unterminated Tag <b' ==> 'Unterminated Tag '
^^
但它不是防弹的:
'If you are < 13 you cannot register' ==> 'If you are '
^^^^^^^^^^^^^^^^^^^^^^^^
'<div data="score > 42">Hello</div>' ==> ' 42">Hello'
^^^^^^^^^^^^^^^^^^ ^^^^^^
如果有人试图破坏您的应用程序,此正则表达式将无法保护您。仅当您已经知道输入的格式时才应使用它。正如其他知识渊博且大部分理智的人所指出的那样,要安全地剥离标签,您必须使用解析器。
如果您没有像 DOM 这样方便的解析器的访问权限,并且您不能相信您的输入是正确的格式,那么您最好使用sanitize-html 之类的包,并且还有其他可用的 sanitizers。
使用浏览器的解析器可能是当前浏览器中最好的选择。以下将起作用,但有以下注意事项:
- 您的 HTML 在
<div>
元素内有效。<body>
或<html>
或<head>
标签中包含的 HTML在 a 中无效<div>
,因此可能无法正确解析。 textContent
(DOM 标准属性)和innerText
(非标准)属性不相同。例如,textContent
将在<script>
元素中包含文本而innerText
不会(在大多数浏览器中)。这仅影响 IE <=8,这是唯一不支持textContent
.- HTML 不包含
<script>
元素。 - HTML 不是
null
- HTML 来自受信任的来源。将其与任意 HTML 一起使用允许执行任意不受信任的 JavaScript。此示例来自 Mike Samuel 对重复问题的评论:
<img onerror='alert(\"could run arbitrary JS here\")' src=bogus>
代码:
var html = "<p>Some HTML</p>";
var div = document.createElement("div");
div.innerHTML = html;
var text = div.textContent || div.innerText || "";
var html = "<p>Hello, <b>World</b>";
var div = document.createElement("div");
div.innerHTML = html;
alert(div.innerText); // Hello, World
这几乎是最好的方法,你让浏览器做它最擅长的事情——解析 HTML。
编辑:正如下面的评论中所指出的,这不是最跨浏览器的解决方案。最跨浏览器的解决方案是递归遍历元素的所有子元素并连接您找到的所有文本节点。但是,如果您使用的是 jQuery,它已经为您完成了:
alert($("<p>Hello, <b>World</b></p>").text());
查看文本方法。
我知道这个问题有一个公认的答案,但我觉得它并不适用于所有情况。
为了完整起见,因为我在这上面花了太多时间,所以我们做了以下工作:我们最终使用了php.js 中的一个函数(对于那些更熟悉 PHP 但也时不时地做一点 JavaScript 的人来说,这是一个非常好的库)然后):
http://phpjs.org/functions/strip_tags:535
它似乎是唯一一段成功处理我填入应用程序的所有不同类型输入的 JavaScript 代码。也就是说,在不破坏它的情况下 - 请参阅我对<script />
上面标签的评论。