利用正则表达式
// 参数 source: 原始字符串
// 参数 keywords: 需要高亮的关键词
// 返回值:替换之后的高亮字符串
function highLight1(source, keywords) {
// 如果用//来创建正则表达式,//里的所有内容都会当做是字符串,所以如果其中有变量,就只能使用new RegExp()创建
// new RegExp()中的第一个参数为字符串;第二个参数为匹配模式
const reg = new RegExp(keywords, 'gi')
return source.replace(reg, `<span style="color: red">${keywords}</span>`)
}
利用字符串,数组方法
// 参数 source: 原始字符串
// 参数 keywords: 需要高亮的关键词
// 返回值:替换之后的高亮字符串
function highLight2(source, keywords) {
// 用keywords把字符串分隔为数组
let tempArr = source.split(keywords)
// 然后再用带有html标签的字符串对tempArr数组进行拼接,拼接为一个满足要求的字符串
return tempArr.join(`<span style="color: red">${keywords}</span>`)
}