刪除HTML標記而不用JavaScript指定名稱

Question

在JavaScript上，它可以使用以下正則表達式刪除文本中的所有HTML標記：

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

另外，我想保留特定的標簽。

ex)<h1>Text</h1><input type="text">Text</input><b>Text</b> → <h1>Text</h1>Text<b>Text</b>

我嘗試了此代碼，但無法正常工作。

replace(/<\/{0,1}!(font|h\d|p|hr|pre|blockquote|ol|ul|...).*?>/ig, "");

請讓我知道最好的配方。

Answer 1

他來了

尤其是在JavaScript中，沒有任何借口。

var div = document.createElement('div');
div.innerHTML = your_input_here;
var allowedtags = "font|h[1-6]|p|hr|...";

var rgx = new RegExp("^(?:"+allowedtags+")$","i");
var tags = div.getElementsByTagName('*');
var length = tags.length;
var i;
for( i=length-1; i>=0; i--) {
    if( !tags[i].nodeName.match(rgx)) {
        while(tags[i].firstChild) {
            tags[i].parentNode.insertBefore(tags[i].firstChild,tags[i]);
            // this will take all children and extract them
        }
        tags[i].parentNode.removeChild(tags[i]);
    }
}

var result = div.innerHTML;

Answer 2

您需要使用否定前瞻：

replace(/<\/?(?!(font|h[1234]|p|hr|input|pre|blockquote|ol|ul))[^>]*>/ig, "");

注意：使用正則表達式時，HTML解析和操作容易出錯。 最好使用DOM解析器。

Answer 3

如何使用這種簡單的功能刪除不需要的標簽：

function sanitize(text, allowed) {

    var tags = typeof allowed === 'string' ? allowed.split(',') : allowed;

    var a = document.createElement('div');
    a.innerHTML = text;

    for (var c = a.childNodes, i = c.length; i--;) {
        if (c[i].nodeType == 1) {
            c[i].innerHTML = sanitize(c[i].innerHTML, tags);
            if (tags.indexOf(c[i].tagName.toLowerCase()) === -1) {
                c[i].parentNode.removeChild(c[i]);
            }
        }
    }

    return a.innerHTML;
}

sanitize('<h1>This is a <script>alert(1)</script> test</h1> <input type="text"> and <b>this</b> should stay.', 'font,h1,h2,p,b,ul')

輸出：

"<h1>This is a  test</h1>  and <b>this</b> should stay."

或者，如果您使用，也可以將標簽替換為其文本內容

c[i].parentNode.replaceChild(document.createTextNode(c[i].innerText);

而不是c[i].parentNode.removeChild(c[i]);