js 改變匹配到的字符串的顏色

1、js判斷是否存在，存在則替換 -- 缺點：只能替換第一個匹配的字符，如果存在多個，則對后面的無效

if(text.indexOf(this.searchText)>=0) {
    text = text.replace(this.searchText,"<span style='color:red;'>" + this.searchText+"</span>");
}
return text;

 

2、正則匹配替換，，完美，，全部可以替換  ，，我的正則中使用了變量，g表示匹配全局，沒有g則只匹配第一個，，

let res = new RegExp("("+this.searchText+")",'g');
text = text.replace(res,"<span style='color:red;'>" + this.searchText+"</span>");
return text;

 

鞏固一下吧

RegExp 對象

1、直接量語法     ----------------------------/pattern/attributes

2、創建 RegExp 對象的語法：---------- new RegExp(pattern, attributes)

參數

參數 pattern 是一個字符串，指定了正則表達式的模式或其他正則表達式。

參數 attributes 是一個可選的字符串，包含屬性 "g"、"i" 和 "m"，分別用於指定全局匹配、區分大小寫的匹配和多行匹配。ECMAScript 標准化之前，不支持 m 屬性。如果 pattern 是正則表達式，而不是字符串，則必須省略該參數。

返回值

一個新的 RegExp 對象，具有指定的模式和標志。如果參數 pattern 是正則表達式而不是字符串，那么 RegExp() 構造函數將用與指定的 RegExp 相同的模式和標志創建一個新的 RegExp 對象。

如果不用 new 運算符，而將 RegExp() 作為函數調用，那么它的行為與用 new 運算符調用時一樣，只是當 pattern 是正則表達式時，它只返回 pattern，而不再創建一個新的 RegExp 對象。

拋出

SyntaxError - 如果 pattern 不是合法的正則表達式，或 attributes 含有 "g"、"i" 和 "m" 之外的字符，拋出該異常。

TypeError - 如果 pattern 是 RegExp 對象，但沒有省略 attributes 參數，拋出該異常。