項目中需求文字高亮

用戶84 發(fā)布于2019-08-26 10:57 / 2858人閱讀

摘要：搜索結(jié)果文字高亮顯示實際項目中的文字高亮自己實現(xiàn)的方法，本來可以使用過濾器我懶就寫了個方法直接上代碼上面是方法高亮方法是需要高亮的句子是高亮關(guān)鍵字?jǐn)?shù)組去重句子變成數(shù)組對句子數(shù)組進(jìn)行循環(huán)數(shù)組轉(zhuǎn)字符串估計都會就是基礎(chǔ)的方法具體看注釋

搜索結(jié)果文字高亮顯示

-實際項目中的文字高亮自己實現(xiàn)的方法，本來可以使用vue過濾器我懶就寫了個方法直接上代碼


  {{}}

上面highLifht是方法

 //高亮方法
    highLight: function(msg, highLightStr) {
      //msg 是需要高亮的句子   highLightStr 是高亮關(guān)鍵字
      let arr = highLightStr.split("");
      arr = Array.from(new Set(arr)); //es6 數(shù)組去重
      let arrmsg = msg.split(""); //句子變成數(shù)組

      for (let j = 0; j < arrmsg.length; j++) {
        //對句子數(shù)組進(jìn)行循環(huán)
        for (let item of arr) {
          if (
            arrmsg[j] === item.toUpperCase() ||
            arrmsg[j] === item.toLowerCase()
          ) {
            arrmsg[j] =
              "" + arrmsg[j] + "";
          }
        }
      }
      return arrmsg.join(""); //數(shù)組轉(zhuǎn)字符串
    },

估計都會就是基礎(chǔ)的方法具體看注釋

云服務(wù)器 GPU云服務(wù)器機(jī)房設(shè)備租賃項目需求任務(wù)書 python 中文字 js中文字閃爍 html 設(shè)置中文字

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

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

相關(guān)文章

手把手教你用jsx封裝Vue中的復(fù)雜組件（網(wǎng)易云音樂實戰(zhàn)項目需求）

摘要：終極解決方案所以我們要統(tǒng)一環(huán)境，直接使用渲染我們的組件，文檔可以參照音樂標(biāo)題歌手專輯時長省去一些細(xì)節(jié)注意需要放在中，的透傳也不要忘了，這樣我們在外部想使用的一些屬性和事件才比較方便。背景介紹最近在做vue高仿網(wǎng)易云音樂的項目，在做的過程中發(fā)現(xiàn)音樂表格這個組件會被非常多的地方復(fù)用，而且需求比較復(fù)雜的和靈活。預(yù)覽地址源碼地址圖片預(yù)覽歌單詳情 showImg(https://se...

HitenDev 2019-08-26 10:28 評論0 收藏0
正則：高亮多個相似關(guān)鍵詞，如京東、京東物流、京東商城…

摘要：最近項目遇到一個小需求，就是在一段文字中，高亮幾個關(guān)鍵詞，例如以下文字京東是中國一家自營式購物網(wǎng)站，創(chuàng)始人劉強(qiáng)東擔(dān)任京東集團(tuán)。年月日，京東集團(tuán)宣布正式組建京東物流子集團(tuán)。最近項目遇到一個小需求，就是在一段文字中，高亮幾個關(guān)鍵詞，例如以下文字：京東（JD.com）是中國一家自營式B2C購物網(wǎng)站，創(chuàng)始人劉強(qiáng)東擔(dān)任京東集團(tuán)CEO。旗下設(shè)有京東商城、京東金融、拍拍網(wǎng)、京東智能、O2O及海外...

neroneroffy 2019-08-01 18:26 評論0 收藏0
正則：高亮多個相似關(guān)鍵詞，如京東、京東物流、京東商城…

摘要：最近項目遇到一個小需求，就是在一段文字中，高亮幾個關(guān)鍵詞，例如以下文字京東是中國一家自營式購物網(wǎng)站，創(chuàng)始人劉強(qiáng)東擔(dān)任京東集團(tuán)。年月日，京東集團(tuán)宣布正式組建京東物流子集團(tuán)。最近項目遇到一個小需求，就是在一段文字中，高亮幾個關(guān)鍵詞，例如以下文字：京東（JD.com）是中國一家自營式B2C購物網(wǎng)站，創(chuàng)始人劉強(qiáng)東擔(dān)任京東集團(tuán)CEO。旗下設(shè)有京東商城、京東金融、拍拍網(wǎng)、京東智能、O2O及海外...

TIGERB 2019-08-22 14:00 評論0 收藏0
正則：高亮多個相似關(guān)鍵詞，如京東、京東物流、京東商城…

摘要：最近項目遇到一個小需求，就是在一段文字中，高亮幾個關(guān)鍵詞，例如以下文字京東是中國一家自營式購物網(wǎng)站，創(chuàng)始人劉強(qiáng)東擔(dān)任京東集團(tuán)。年月日，京東集團(tuán)宣布正式組建京東物流子集團(tuán)。最近項目遇到一個小需求，就是在一段文字中，高亮幾個關(guān)鍵詞，例如以下文字：京東（JD.com）是中國一家自營式B2C購物網(wǎng)站，創(chuàng)始人劉強(qiáng)東擔(dān)任京東集團(tuán)CEO。旗下設(shè)有京東商城、京東金融、拍拍網(wǎng)、京東智能、O2O及海外...

cgspine 2019-08-29 14:18 評論0 收藏0
?如何用JS實現(xiàn)“劃詞高亮”的在線筆記功能？?

1. 什么是劃詞高亮？有些同學(xué)可能不太清楚劃詞高亮是指什么，下面就是一個典型的劃詞高亮： showImg(https://segmentfault.com/img/remote/1460000018981816?w=1195&h=720); 上圖的示例網(wǎng)站可以點擊這里訪問。用戶選擇一段文本（即劃詞），即會自動將這段選取的文本添加高亮背景，用戶可以很方便地為網(wǎng)頁添加在線筆記。筆者前段時間為線上業(yè)...

trigkit4 2019-08-23 17:07 評論0 收藏0