正则表达式强调匹配的字符串答案

【问题标题】：Regular expression to emphasize the matched string正则表达式强调匹配的字符串
【发布时间】：2014-05-06 01:26:05
【问题描述】：

我是正则表达式的新手...

我有一个搜索字符串，是查询数据库的结果。

在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

【问题讨论】：

标签： javascript regex

【解决方案1】：

我会在您的模式周围使用单词边界\b，然后进行替换。

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

【讨论】：

边界是什么意思？
单词字符 (\w) 和非单词字符之间的界限。因此，例如 \bdolor\b 将匹配 dolor 但它不会匹配作为另一个单词一部分的 dolor，例如它不会匹配 foodolor

【解决方案2】：

试试这个：

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);

Regex demo
Javascript demo

【讨论】：

你能不能在表达式中使用 q 变量而不是硬编码字符串
@user2727195 当然，1m
请不要区分大小写，
@user2727195 检查我的答案，这正是你所需要的:) 如果我的回答对你有帮助，请考虑接受它作为正确答案，谢谢！
忘了说，dolor是变量q里面的值，需要一个参数化的正则表达式

【解决方案3】：

这是一个不错的简单函数，它应该可以解决问题，只需将数据库字符串和子字符串传递给此函数，它将返回一个新字符串，其中包含在  标签中的子字符串的所有实例

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>'

【讨论】：

我总是使用正则表达式，因为“全局”标志允许更改匹配字符串的多个实例。这个例子只会改变匹配词的第一个实例，所以这不起作用。
@josephnvu: new RegExp(sub, 'g') 将全局标志打开。
是的，你去。完美！
转义问题我认为，如果写入文档，它会写成 我们可以解决这个问题吗？
哦，我正要说。如果是小胡子，请使用三括号 {{{ html code here }}}

【解决方案4】：

参考字符串替换命令，如：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions

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

【讨论】：

看起来不错，但你能用 q 代替 dolor 吗？变量本身，不能硬编码搜索字符串，如果那怎么办？
请注意，您可以使用$& 插入整个匹配项。
类似：var pattern = new RegExp(q, 'g'); result = result.replace(pattern, '$&');，但您需要注意任何特殊字符都被正确转义（例如“*”和“+”）。如果您只想替换文字字符串，可以将其作为要替换的参数传递，如：result = result.replace(simpleStr, ''+simpleStr+'')

【解决方案5】：

如果您的搜索字符串不是正则表达式，您可以使用split 并避免转义问题：

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

顺便说一句， 可能更合适。

不区分大小写不是那么简单，但我还是不会使用正则表达式：

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。

【讨论】：

可以不区分大小写吗？