正則表達式以強調匹配的字符串

Question

我是正規表達的新手......

我有一個搜索字符串，並且是查詢數據庫的結果。

在Javascript中如何搜索字符串並強調或加粗它。

讓我們說吧

q="dolor";
result = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit";

結束字符串應該有

Lorem ipsum <em>dolor</em> sit amet, consectetur adipiscing elit, Lorem ipsum <em>dolor</em> sit amet, consectetur adipiscing elit, Lorem ipsum <em>dolor</em> sit amet, consectetur adipiscing elit

Answer 1

嘗試這個：

var sentence = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit"; 
var match = "dolor";
var replace = "<em>"+match+"</em>";
var regexp = new RegExp(match, "gi");
var output = sentence.replace(regexp, replace);
alert(output);

正則表達式演示
Javascript演示

Answer 2

我會在你的模式周圍使用一個單詞邊界\\b然后進行替換。

var re = new RegExp("\\b" + q + "\\b", "gi");
result = result.replace(re, "<em>" + q + "</em>");

Answer 3

這是一個很好的簡單函數，應該可以做到這一點，只需將數據庫字符串和子字符串傳遞給此函數，它將返回一個新字符串，其中包含<em>標記中包含的所有子字符串實例

function emphasize(str, sub) {
  return str.replace(new RegExp(sub, 'g'), '<em>' + sub + '</em>'); 
}

var str = "Teenage mutant JavaScript ninja. Loves JavaScript",
    sub = "JavaScript";

emphasize(str, sub);
=> 'Teenage mutant <em>JavaScript</em> ninja. Loves <em>JavaScript</em>'

Answer 4

請參閱字符串替換命令，如下所述： https ： //developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions

result = result.replace(/(dolor)/g, '<em>$1</em>');

Answer 5

如果您的搜索字符串不是正則表達式，則可以使用split並避免轉義問題：

result.split(q).join('<em>' + q + '</em>')

順便說一句， <mark>可能更合適。

不區分大小寫不是那么簡單，但我仍然不會使用正則表達式：

function highlight(text, find) {
    var lowercaseText = text.toLowerCase();
    var lowercaseFind = find.toLowerCase();
    var result = '';
    var lastIndex = 0;
    var i;

    while ((i = lowercaseText.indexOf(lowercaseFind, lastIndex)) !== -1) {
        result +=
            text.substring(lastIndex, i) +
            '<em>' + text.substring(i, i + find.length) + '</em>';

        lastIndex = i + find.length;
    }

    return result + text.substring(lastIndex);
}

它也非常適合與DOM一起工作。