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

資訊專欄INFORMATION COLUMN

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

劉厚水 / 3458人閱讀

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

在不考慮關(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)用的時(shí)候warpTag("要檢索的內(nèi)容","檢索的關(guān)鍵字","給內(nèi)容中的關(guān)鍵字加上的有特殊標(biāo)記的標(biāo)簽名")

2.如果關(guān)鍵字允許是特殊字符的情況下,就要做區(qū)別處理,因?yàn)橛行┨厥庾址谡齽t中有特殊含義(例如:^*+?等,具體可參考正則表達(dá)式手冊(cè)):

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)鍵字加上的有特殊標(biāo)記的標(biāo)簽名")。
本篇文章主要用來記載工作項(xiàng)目中遇到的,本人覺得有必要記下來的知識(shí)點(diǎn),方便在以后遇到時(shí)可以直接使用,也給遇到同樣問題的其他人提供一個(gè)思路。

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

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

相關(guān)文章

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

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

    AlienZHOU 評(píng)論0 收藏0
  • 實(shí)現(xiàn)DataTables搜索框查詢結(jié)果高亮顯示

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

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

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

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

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

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

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

    Donald 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

劉厚水

|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<