搜索關鍵字高亮 JS replace() 變量的全局替換

一般搜索回來關鍵字高亮是 後端直接拼好字符串給咱們的。
固然也有例如 後端偶爾不想作, 那就咱們替換下好了...
JS沒有replaceAll的。html

//錯誤示範
var data = '聖誕節卡都是快樂的事快樂速度回家快樂';
var key = '快樂';
data.replace(key,"替換"); 》》》 只替換了第一個快樂

data.replace(/key/g,'替換') 》》》 徹底不替換

so 如下兩個方法後端

//一 利用 JavaScript eval() 函數
//應該避免或減小使用eval 不安全,很是耗性能(2次,一次解析成js語句,一次執行)

var data = '聖誕節卡都是快樂的事快樂速度回家快樂';
var key = '快樂';
var reg = eval('/'+key+'/g');
data.replace(reg,'替換')
//二 利用 JavaScript 的 RegExp 對象
//更推薦使用

var data = [{"title": "少兒保障、理財全能少兒產品"},
            {"title": "少兒保障、理財全能幼兒產品"},
            {"title": "少兒保障、理財全能成年產品"},
            {"title": "少兒保障、理財全能老年產品"}
            ]

var search_key = '少兒';
var reg = new RegExp(search_key,'g');
var html = '';
for(var i=0; i< data.length; i++){
 html += '<li>'+data[i].title.replace(reg,('<span style="color:red">'+search_key+'</span>'))+'</li>'
}

console.log(html)

mark一下 僅供參考 歡迎更正補充 end安全

相關文章
相關標籤/搜索