繁体   English   中英

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

[英]Regular expression to emphasize the matched string

我是正规表达的新手......

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

在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

尝试这个:

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演示

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

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

这是一个很好的简单函数,应该可以做到这一点,只需将数据库字符串和子字符串传递给此函数,它将返回一个新字符串,其中包含<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>'

请参阅字符串替换命令,如下所述: https//developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions

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

如果您的搜索字符串不是正则表达式,则可以使用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一起工作。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM