javascript设置字体高亮

最新推荐文章于 2023-09-28 08:52:07 发布

转载最新推荐文章于 2023-09-28 08:52:07 发布 · 391 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/mricle/p/3783071.html

文章标签：

#javascript #ViewUI

本文介绍了一种使用JavaScript实现的搜索结果高亮显示方法。通过正则表达式和字符串替换功能，可以将搜索关键词在结果中突出显示。适用于网页搜索等应用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

字体高亮一般用在网站搜索的时候，通常我们会把搜索出来的文字设置成高亮，像百度搜索出来的一样，搜索关键字会变成红色高亮。下面通过javascript把字符串中的指定文字设置高亮。我们通过RegExp和replace来完成。

RegExp：javascript中的正则表达式对象。

RegExp（reg，attributes）：reg参数是验证的正则表达式或者字符串，attributes参数是一个可选字符串且只能是"g","i","m"三个字母。

"g"：匹配被验证字符串中的所有匹配文字；

"i"：不区分大小写；

"m"：多行模式考虑换行。

如果reg参数为Reg对象而非字符串，则必须省略attributes参数，否则抛出异常。

    var highLight = function (c, t) {
        if (c == undefined || c == "" || c == null)
            return c;
        var arr = t.split(" ");
        var r = "";
        for (var i = 0; i < arr.length; i++) {
            if (i == 0)
                r = r + "(";
            r = r + arr[i];
            if (i != arr.length - 1)
                r = r + "|";
            else
                r = r + ")";
        }
        return c.replace(new RegExp(r, "gi"), function (v) {
            return v.fontcolor('red');
        })
    }