Javascript正則表達式

Question

對於我正在處理的快速「搜索和突出顯示」腳本有一個小問題。我使用正則表達式是因爲我想在文檔加載後在客戶端執行全部搜索。我的搜索/加亮功能是這樣的：

function highlight(word, colour, container) { 
    var regex = new RegExp("(>[^<]*?)(" + word + ")", "ig"); 
    var replace = "$1<span name='searchTerm' style='background-color: " + colour + "'>$2</span>"; 

    if (regex.exec(container.innerHTML)) { 
     container.innerHTML = container.innerHTML.replace(regex, replace); 
     return true; 
    } 
    return false; 
} 

word是搜索這個詞，colour是顏色突出顯示，container在搜索元素

考慮包含這個元素。 ：

<ul> 
    <li>Set the setting to the correct setting.</li> 
</ul> 

說我把單詞「set」傳遞給了高亮功能。在目前的狀態下，由於惰性重排，它只能找到第一個實例。

那麼，如果我改變了正則表達式是：

var regex = new RegExp("(>[^<]*?)?(" + word + ")", "ig"); 

這就是現在的偉大工程，它強調的字符串「集合」的所有實例。但是，如果我傳遞搜索詞「li」，那麼它將替換標籤內的文本！

有沒有這個正則表達式的快速解決方案來獲得我想要的行爲？我需要它來替換搜索字符串的所有實例，但不會將其作爲標記的一部分。我想使用正則表達式保持客戶端。

謝謝！

Answer 1

You shouldn't be using regex to parse HTML。正確地走DOM樹並進行搜索並替換純文本。

順便說一句，有一個jQuery插件，做你想做的;你可以使用它，或者看一下就獲得關於如何做到這一點的想法：
http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html