搜索高亮关键词并获取上下文

  • 搜索文章时高亮关键词,并截取关键词所在位置的上下文。
let keywords = []  // 多关键词
let text = '...' // 正文
let regStr = '' // 正则表达式字符串
keywords.forEach(item=>{
  if (item !== '') {
          if (regStr ) ref+= '|'
          // ?非贪婪匹配:正则表达式碰到到第一个匹配到的字符串就
          regStr += `(\\S*?)(${item})([\\s\\S]{0,60})`
          // \b匹配一个单词的边界,也就是指单词和空格间的位置
          // regStr += `(\\b\\S*?)(${item})([\\s\\S]{0,60})`
        }
})
let reg = RegExp(regStr,'gm') // 正则表达式
// 找到一个或多个正则表达式的匹配,match() 方法将执行全局检索,找到所有匹配子字符串,返回一个数组
let cont = item.content.match(reg) 
// 高亮后的文本
let content = ''
// 统计字数
let len = 0

// 循环匹配到的数组,并对相关数据做处理
if (cont) {
  // 高亮的关键词的前面的文本
  let first = ''
  cont.forEach((str, index) => {
    if (index && str) {
      // console.log(str)
      // 循环与正则表达式的子表达式匹配的文本
      if (index % 3 === 1) {
        // 匹配的第一个子表达式,即高亮的关键词的前面的文本
        first = str
      } else {
        len += str.length
        content += str.replace(regT, ($1) => {
          return `<span class="mclr">${$1}</span>`
        })
      }
    }
  })
  // 取多少长度的匹配字符串前的文本,移动端控制显示文本的长度
  if (first) {
    if (len < 20) {
      content = (first.substr(0, 70) +
        (first.length <= 70 ? '' : '...')) +
        content
    } else if (len < 40) {
      content = (first.substr(0, 50) +
        (first.length <= 50 ? '' : '...')) +
        content
    } else {
      content = (first.substr(0, 15) +
        (first.length <= 15 ? '' : '...')) +
        content
    }
  }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。