Toc
0 results found
Utone
高亮字符
2021/08/27

酒店搜索联想下拉框,有一个高亮字符的需求,一个字条,对应多个高亮字符

eg: 上海海景房
高亮词条为<海景><海景房> => 上海海景房
标签不嵌套,取高并集加标签

function hightlight(str, arr) {
  str = `#${str.split('').join('#')}#`
  arr = arr.map((item) => `#${item.split('').join('#')}#`)
  let fill = new Array(str.length).fill(0)

  for (let i = 0; i < str.length; i++) {
    if (str[i] !== '#') continue

    for (let j = 0; j < arr.length; j++) {
      let length = arr[j].length

      if (str.substr(i, length) === arr[j]) {
        fill[i]++
        fill[i + length - 1]--
      }
    }
  }

  let res = ''

  fill.reduce((prev, item, key) => {
    let total = prev + item

    if (prev === 0 && total > 0) {
      res += `<span>${str[key]}`
    } else if (total === 0 && item < 0) {
      res += `${str[key]}</span>`
    } else if (item === 0) {
      res += `${str[key]}`
    }

    return total
  }, 0)

  return res.replace(/\#/g, '')
}
打赏
支付宝
微信
本文作者:Utone
版权声明:本文首发于Utone的博客,转载请注明出处!