最近项目遇到一个问题，要求搜索关键词，支持大小写匹配，搜索了很多百度文章都是正则replace，但是都会有一个问题 替换的标签也会被匹配到。查阅资料，发现正则分组是个好东西，感兴趣可以自行搜索正则分组https://www.jianshu.com/p/2b1557f60967(正则分组匹配介绍)，搜索关键词高亮方法直接上代码
支持多字符空格匹配
highlights(list, str) {
str = str + ''
//将str代码支离为HTML片段和文字片段，其中文字片段用于正则替换处理，而HTML片段置之不理
var tags = /[^<>]+|<(\/?)([A-Za-z]+)([^<>]*)>/g;
var a = str.match(tags);
if (a) {
list.map((searchText)=>{
if(searchText.lightinput !== "" && searchText.lightinput) {
for (let i = 0; i < a.length; i++) {
var content = a[i];
if (!/<(?:.|\s)*?>/.test(content)) { //非标签
// foreach search keyword.
var keyWords = searchText.lightinput.trim().split(" ");//关键字去空格变成数组
for (let k = 0; k < keyWords.length; k++) {
// 匹配关键字正则
let replaceReg = new RegExp("("+keyWords[k]+")", "gmi");
content = content.replace(replaceReg,"♂"+k+"$1♀")；
}
}
content = content.replace(/♂(\d)/g,`<mark style="background: ${searchText.color}">`).replace(/♀/ig,"</mark>");
a[i] = content;
}
}
})
return a.join("");
}
return str;
},
