JQuery：將樣式添加到正則表達式匹配中

我想在我的網站中將HTML代碼顯示爲文本。我在我的HTML下面的示例文本：JQuery：將樣式添加到正則表達式匹配中

<div id="test"> 
    &lt;p&gt;Hello&lt;/p&gt; <br /> 
    &lt;p&gt;Hello2&lt;/p&gt; 
</div>

表示：

<p>Hello</p> 
<p>Hello2</p>

在我的網站。

現在我想更改標籤的顏色。我在互聯網上找到了這樣一個想法，即用一個班級中的同一個文本替換RegExp，以更改該範圍的樣式。

我試着按照JQuery的：

$(document).ready(function() 
{ 
    var oldHtml = $("#test").html(); 
    var newHtml = oldHtml.replace(new RegExp("(&lt;){1}.*(&gt){1};","g"), "<span class='highlight'>$1</span>"); 
    $("#test").html(newHtml); 
});

，得到了以下幾點：

< 
<

我在做什麼錯？

來源

2017-04-19 Damien Flury

你可能會更好地把你的代碼放在'pre'或類似的地方，並使用一個庫來進行語法高亮顯示。滾動你自己將會有很多工作。看看SO吧。 – simbabque

捕獲組位於錯誤的地方。您正在將開頭支架截取爲$1，並將閉合支架截取爲$2，您從未使用該支架。

(&lt;){1}.*(&gt){1};

你也不需要的量詞。

&lt;(.*?)&gt;

有了這種模式和相同的替代它應該工作。量詞使其不會貪婪，因此它儘可能早地停止任何事情的匹配。

請注意，用正則表達式解析HTML是一個壞主意。即使部分HTML被轉義出來，它仍然是一種非常規的硬性語言。它最終不會起作用。改用解析器。或者對於您的用例，只需使用許多易於查找和使用語法高亮庫之一。

來源

2017-04-19 11:21:38 simbabque

我從手機發出這個提示。該模式可能包含輸入錯誤。 – simbabque

好的，謝謝你的回答。我正在使用語法高亮庫:) –

JQuery：將樣式添加到正則表達式匹配中

回答

相關問題