Javascript，使用正則表達式僅替換HTML標記之外的內容

Question

我試圖用JavaScript寫一個正則表達式來替換HTML標記之外的字符串，並忽略HTML標記內的字符串。

這是我的JavaScript代碼：

var content = "Hi, my <span user="John">name</span> is &nbsp;John";
var user = 'John';
var regex = new RegExp('(&nbsp;)?' + user,'g');
content.replace(regex, function($0,$1){
    return $1 ? $0 : '<img src="images/user.png">';
});

我的正則表達式是"( )?John" 。

該模式按照我想要的方式工作，但是將匹配項應用於標簽數據，而這並不是我想要的。

因此，我們的想法是忽略標記<和>之間的所有內容，並忽略：  John 。

能做到嗎

Answer 1

描述

該正則表達式將與John匹配，前提是它位於字符串的開頭或結尾，並且/或者在兩邊都有空格。

正則表達式以匹配John： (?:\\s| |^)(John)(?=\\s|\\r|\\n|$)

此正則表達式合並了最后一個正則表達式，並且還匹配所有html標簽和純文本url。 這里的順序很重要，因為John僅在html標記之外或未嵌入URL的情況下才匹配。

正則表達式： https?:\\/\\/[^\\s]*|<\\/?\\w+\\b(?=\\s|>)(?:='[^']*'|="[^"]*"|=[^'"][^\\s>]*|[^>])*>|\\&nbsp;John|(John)

如果您使用了最后一個正則表達式並將其傳遞給函數，則只有位於標記和網址之外的John會被替換為字符串。

Javascript范例

工作示例： http : //repl.it/J4T

碼

var content = "<span name=\"John\" funnytag:John>John John &nbsp;John DoeJohn JohnDoe Mr.JohnDoe http://cool.guy.john/LikesKittens</span>";
var rePattern = /https?:\/\/[^\s]*|<\/?\w+\b(?=\s|>)(?:='[^']*'|="[^"]*"|=[^'"][^\s>]*|[^>])*>|\&nbsp;John|(John)/gi;

content.replace(rePattern, function(match, capture) {
    return capture ? "<img src=\"images/user.png\">" : match;
});

產量

<span name="John" funnytag:John><img src="images/user.png"> <img src="images/user.png"> &nbsp;John Doe<img src="images/user.png"> <img src="images/user.png">Doe Mr.<img src="images/user.png">Doe http://cool.guy.john/LikesKittens</span>

Answer 2

如果我的理解正確，就是說您要替換與正則表達式匹配的任何內容，只要它不包含在標記中即可，即John和可能的前一個不間斷空格將替換為function($0,$1) 除非它出現在HTML代碼中？

如果是這樣，則可以將此后向斷言添加到正則表達式的開頭： (?<!<[^>]*?) 。 這告訴正則表達式如果從匹配中向后讀取，則在遇到>之前沒有遇到< ，從而匹配該模式。

這將是您的代碼：

var regex = new RegExp('(?<!<[^>]*?)(&nbsp;)?' + user,'g');