搜索多关键字,匹配内容并将关键字高亮显示
要求:搜索多关键字用空格隔开,不匹配标签
keysLight (keyWord, content) { // 搜索文字处理: 以空格分隔关键字, 去重,倒序(先匹配文字多的,再匹配文字少的) const searchArray = keyWord.split(' ').filter(item => item.length) const keys = [...new Set(searchArray)].sort((a, b) => { return b.length - a.length }) let text = content keys.forEach(key => { const stringKey = '<font color="#f56c6c">' + key + '</font>' let num = -1 // 存放html数组对应的索引 const regKey = new RegExp(key, 'gi') const regHtml = new RegExp('<.*?>', 'ig') // 匹配html元素 const arrayHtml = text.match(regHtml) // 存放html元素的数组 text = text.replace(regHtml, '{~}') // 替换html标签 text = text.replace(regKey, stringKey) // 替换关键字 text = text.replace(/{~}/g, function () { // 恢复html标签 num++ return arrayHtml[num] }) }) return text }