Javascript 只允许特定的 HTML 标签

Question

我有一个很长的 HTML 字符串，我想解析它只允许某些 html 标签通过。

允许的标签有粗体、斜体、下划线、段落、有序列表和无序列表。

应返回这些标签及其相应的文本。应删除所有其他标签，只应为这些标签保留内部 HTML。

对于以下输入，输出应该是这样的：

输入：There is some text here 输出：There is some text here

输入：text here 输出：这里的文本

输入：<div>Combo of allowed tag and disallowed tag</div> 输出：Combo of allowed tag and disallowed tag

我看过这个类似的问题：Regex to allow only set of HTML Tags and Attributes。但是，我想知道您在 Javascript 中会怎么做？我目前正在遍历 html 并搜索允许的标签，如下所示：

var htmlString = "<p>There is some <u>text</u> here</p>";
var allowedTags = ["<b>", "<i>", "<u>", "<p>", "<ol>", "<ul>"];
for (i = 0, len = allowedTags.length; i < len; i++) {
    var ind = htmlString.indexOf(allowedTags[i]);
}

但这不起作用，尤其是当字符串中有多个 html 标记时。非常感谢您的帮助！

Answer 1

您似乎想在 javascript 中模拟 php。
你可以试试 phpjs.org 函数 strip_tags see here

function strip_tags(input, allowed) {
//  discuss at: http://phpjs.org/functions/strip_tags/
// original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// improved by: Luke Godfrey
// improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
//    input by: Pul
//    input by: Alex
//    input by: Marc Palau
//    input by: Brett Zamir (http://brett-zamir.me)
//    input by: Bobby Drake
//    input by: Evertjan Garretsen
// bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// bugfixed by: Onno Marsman
// bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// bugfixed by: Eric Nagel
// bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// bugfixed by: Tomasz Wesolowski
//  revised by: Rafał Kukawski (http://blog.kukawski.pl/)
//   example 1: strip_tags('<p>Kevin</p> <br /><b>van</b> <i>Zonneveld</i>', '<i><b>');
//   returns 1: 'Kevin <b>van</b> <i>Zonneveld</i>'
//   example 2: strip_tags('<p>Kevin <img src="someimage.png" onmouseover="someFunction()">van <i>Zonneveld</i></p>', '<p>');
//   returns 2: '<p>Kevin van Zonneveld</p>'
//   example 3: strip_tags("<a href='http://kevin.vanzonneveld.net'>Kevin van Zonneveld</a>", "<a>");
//   returns 3: "<a href='http://kevin.vanzonneveld.net'>Kevin van Zonneveld</a>"
//   example 4: strip_tags('1 < 5 5 > 1');
//   returns 4: '1 < 5 5 > 1'
//   example 5: strip_tags('1 <br/> 1');
//   returns 5: '1  1'
//   example 6: strip_tags('1 <br/> 1', '<br>');
//   returns 6: '1 <br/> 1'
//   example 7: strip_tags('1 <br/> 1', '<br><br/>');
//   returns 7: '1 <br/> 1'

allowed = (((allowed || '') + '')
.toLowerCase()
.match(/<[a-z][a-z0-9]*>/g) || [])
.join(''); // making sure the allowed arg is a string containing only tags in lowercase (<a><b><c>)
var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi,
commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi;
return input.replace(commentsAndPhpTags, '')
.replace(tags, function([=10=], ) {
  return allowed.indexOf('<' + .toLowerCase() + '>') > -1 ? [=10=] : '';
});
}

就这样使用吧:

var str = strip_tags(
   '<p>There is some <u>text</u> here</p>',
   '<b><i><u><p><ol><ul>' // Allowed tags
);

Javascript 只允许特定的 HTML 标签

Javascript allow only specific HTML tags

html

javascript

strip-tags