成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

對文章進行搜索關(guān)鍵字過濾,并顯示高亮的javascript實現(xiàn)方法之一

AlienZHOU / 1555人閱讀

摘要:本篇文章主要用來記載工作項目中遇到的,本人覺得有必要記下來的知識點,方便在以后遇到時可以直接使用,也給遇到同樣問題的其他人提供一個思路。

在不考慮關(guān)鍵字是特殊字符的情況下:

warpTag (content, keyword, tagName) {
      if (content === "No results") {
        return content
      }
      const a = content.toLowerCase()
      const b = keyword.toLowerCase()
      const indexof = a.indexOf(b)
      const c = indexof > -1 ? content.substr(a.indexOf(b), keyword.length) : ""
      const val = `<${tagName}>${c}`
      const regS = new RegExp(keyword, "gi")
      return content.replace(regS, val)
    }

調(diào)用的時候warpTag("要檢索的內(nèi)容","檢索的關(guān)鍵字","給內(nèi)容中的關(guān)鍵字加上的有特殊標記的標簽名")

2.如果關(guān)鍵字允許是特殊字符的情況下,就要做區(qū)別處理,因為有些特殊字符在正則中有特殊含義(例如:^*+?等,具體可參考正則表達式手冊):

warpTag (content, keyword, tagName) {
    if (content === "") {
      return content
    }
    const a = content.toLowerCase()
    const b = keyword.toLowerCase()
    const indexof = a.indexOf(b)
    const c = indexof > -1 ? content.substr(a.indexOf(b), keyword.length) : ""
    const val = `<${tagName} class="keywords">${c}`
    let characterReg = /^.*[!~@#$%^&*(_)+-=`,./<>?;":"|[]{}].*$/
    let regS
    if (characterReg.test(keyword)) {
      if (keyword.length === 1) {
        regS = new RegExp("" + keyword, "gi")
      } else {
        let keywordNew = ""
        for (let i = 0; i < keyword.length; i++) {
          keywordNew += i < keyword.length - 1 ? keyword.substr(i, 1) + "" : keyword.substr(i, 1)
        }
        keyword = keywordNew
      }
      regS = new RegExp("" + keyword, "gi")
    } else {
      regS = new RegExp(keyword, "gi")
    }
    return content.replace(regS, val)
  }

使用方法同上:warpTag("要檢索的內(nèi)容","檢索的關(guān)鍵字","給內(nèi)容中的關(guān)鍵字加上的有特殊標記的標簽名")。
本篇文章主要用來記載工作項目中遇到的,本人覺得有必要記下來的知識點,方便在以后遇到時可以直接使用,也給遇到同樣問題的其他人提供一個思路。

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/100169.html

相關(guān)文章

  • 文章進行搜索關(guān)鍵字過濾顯示高亮javascript實現(xiàn)方法之一

    摘要:本篇文章主要用來記載工作項目中遇到的,本人覺得有必要記下來的知識點,方便在以后遇到時可以直接使用,也給遇到同樣問題的其他人提供一個思路。 在不考慮關(guān)鍵字是特殊字符的情況下: warpTag (content, keyword, tagName) { if (content === No results) { return content } ...

    劉厚水 評論0 收藏0
  • 實現(xiàn)DataTables搜索框查詢結(jié)果高亮顯示

    摘要:宋體三搜索框查詢結(jié)果高亮顯示的其他方法宋體。宋體四總結(jié)宋體實現(xiàn)搜索框查詢結(jié)果高亮顯示的功能需要引入文件,文中提供了種這類文件,并說明了要配套編寫的相關(guān)代碼。DataTables是封裝好的HTML表格插件,豐富了HTML表格的樣式,提供了即時搜索、分頁等多種表格高級功能。用戶可以編寫很少的代碼(甚至只是使用官方的示例代碼),做出一個漂亮的表格以展示數(shù)據(jù)。關(guān)于DataTables的更多信息,請查...

    番茄西紅柿 評論0 收藏0
  • 一個前端開發(fā)工程師Vim跟IDE一樣

    摘要:一組就是一個插件,的很多功能都由各式插件實現(xiàn)。與相反到行頭到本行的第一個非字符到行尾到本行最后一個不是字符的位置。到逗號前的第一個字符。在當前行查找第三個出現(xiàn)的。工程文件菜單自定義快捷鍵顯示文件菜單自帶快捷鍵顯示隱藏隱藏文件在新 這里是我新配置出來的 jaywcjlove/vim-web 一直在打磨中,基本上可以用了。拿出來騙 star 先上圖 showImg(https://segm...

    Vultr 評論0 收藏0
  • Jerry和您聊聊Chrome開發(fā)者工具

    摘要:開發(fā)者工具是日常工作使用的三大調(diào)試器之一。當然我可以在開發(fā)者工具的標簽頁手動選中響應(yīng)內(nèi)容,然后,再到本地新建一個文件,。注開發(fā)者工具顏色的修改希望這篇文章能讓您對開發(fā)者工具有一些更深入的了解,感謝閱讀。 Chrome開發(fā)者工具是Jerry日常工作使用的三大調(diào)試器之一。雖然工具名稱前面帶了個開發(fā)者, 但是它對非開發(fā)人員仍然有用。不信? 用Chrome打開我們常用的網(wǎng)站,按F12,在Con...

    binta 評論0 收藏0
  • Jerry和您聊聊Chrome開發(fā)者工具

    摘要:開發(fā)者工具是日常工作使用的三大調(diào)試器之一。當然我可以在開發(fā)者工具的標簽頁手動選中響應(yīng)內(nèi)容,然后,再到本地新建一個文件,。注開發(fā)者工具顏色的修改希望這篇文章能讓您對開發(fā)者工具有一些更深入的了解,感謝閱讀。 Chrome開發(fā)者工具是Jerry日常工作使用的三大調(diào)試器之一。雖然工具名稱前面帶了個開發(fā)者, 但是它對非開發(fā)人員仍然有用。不信? 用Chrome打開我們常用的網(wǎng)站,按F12,在Con...

    Donald 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<