高亮匹配关键词样式highLightMatchString、replaceHTMLChar

你挚爱的强哥2025-07-24 23:11

javascript 复制代码

    replaceHTMLChar: s => s.toString().replace(/</g, `&lt;`).replace(/>/g, `&gt;`),

    // 高亮匹配关键词样式----------------------------------------
    highLightMatchString(originStr, matchStr, customClass = ``) {
        matchStr && (matchStr = matchStr.replace(/[.*+?^${}()|[\]\\]/g, ``));//过滤掉字符串里面的出现的正则表达式字符
        if (matchStr === ``) return originStr;
        customClass === true && (customClass = `sg-search-word-highlight`);
        let newRepStr = (match = matchStr) => customClass ? `<span class=${customClass}>${this.replaceHTMLChar(match)}</span>` : `<b style='color:red;font-weight:bold;'>${this.replaceHTMLChar(match)}</b>`;
        // return this.replaceHTMLChar(originStr).replace(new RegExp(this.replaceHTMLChar(matchStr), `gi`), newRepStr(matchStr));
        return this.replaceHTMLChar(originStr).replace(new RegExp(this.replaceHTMLChar(matchStr), `gi`), (match, index) => newRepStr(match));// 返回原始匹配项，如果不希望替换，可以返回match
    },