js replace替換字符串同時替換多個方法

更新時間：2018年11月27日 10:22:44 作者：伊澤瑞爾

這篇文章主要介紹了js replace替換字符串同時替換多個方法的相關(guān)資料,需要的朋友可以參考下

在實際開發(fā)中，經(jīng)常會遇到替換字符串的情況，但是大多數(shù)情況都是用replace替換一種字符串，本文介紹了如何使用replace替換多種指定的字符串，同時支持可拓展增加字符串關(guān)鍵字。　　　　　　　　

let content = `<div id="article_content273475" class="article-content-wrap"> 
 <p><strong>宅是一種信仰。</strong><br></p>
 <p><br></p>
 <p>Wi-Fi + 床 = 低配宅。</p>
 <p><br></p>
 <p>Wi-Fi + 床 + 零食 + 網(wǎng)綜= 進(jìn)階版肥宅。</p>
 <p><br></p>
 <p>Wi-Fi + 床 + 零食 + 網(wǎng)綜 + 外賣 + 擼貓 = 人間天堂金不換宅。</p>
 <p><br></p>
 <p>移動互聯(lián)網(wǎng)迅猛發(fā)展的當(dāng)下，“人間天堂金不換”版宅可以說是當(dāng)下一些“9000歲”<span class="text-remarks" label="備注">（即“90后”和“00后”）</span>年輕人的生活常態(tài)了。</p>
　　　　　    </div>`;
       let article = content.replace(/(\<img|\<p|\<article|\<\/article|\<header|\<\/header)/gi, function ($0, $1) {
       return {
        "<img": '<img style="width:100%;height:auto;display:block;" ',
        "<p": '<p style="text-indent: 24px;" ',
        "<article":"<div",
        "</article": "</div",
        "<header": "<div",
        "</header": "</div"
       }[$1];
      });
      console.log(article)

replace里的g表示全局替換，而每個關(guān)鍵詞前面的\則為轉(zhuǎn)義字符，在針對html類的標(biāo)簽替換的時候，是必不可少的。

下面看下js同時替換多個字符串的方法

<script>
  var s="my javascript is very poor,who can help me?"
  var reg=/(\w*)my(.*)is(.*)can(.*)/g
  alert(s.replace(reg,"$1his$2was$3could$4"));
</script>

總結(jié)

以上所述是小編給大家介紹的js replace替換字符串同時替換多個方法，希望對大家有所幫助，如果大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復(fù)大家的！

您可能感興趣的文章:

相關(guān)文章

Javascript中的async awai的用法
本篇文章主要介紹了Javascript中的async/awai的用法，將分享async / await是如何工作的，有興趣的可以了解一下
2017-05-05
javascript系統(tǒng)時間設(shè)置操作示例
這篇文章主要介紹了javascript系統(tǒng)時間設(shè)置操作,涉及javascript時間運算與判斷相關(guān)操作技巧,需要的朋友可以參考下
2019-06-06
關(guān)于VSCode格式化JS自動添加或去掉分號的問題
這篇文章主要介紹了VSCode格式化JS自動添加或去掉分號的問題，本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2021-10-10
javascript tabIndex屬性
圍繞表單的可訪問性與交互性上，各瀏覽器都下了很大工夫，比如fieldset與legend等用于增強(qiáng)區(qū)域感的元素，for，accessKey，defaultValue，maxlength，tabIndex等用于交互或提示的屬性。不過，今天只講tabIndex。
2009-12-12
webpack配置sass模塊的加載的方法
本篇文章主要介紹了webpack加載sass配置，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-07-07
js實現(xiàn)本地持久化存儲登錄注冊
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)本地持久化存儲登錄注冊，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-08-08
JavaScript算法系列之快速排序（Quicksort）算法實例詳解
這篇文章主要介紹了JavaScript算法系列之快速排序（Quicksort）算法實例詳解的相關(guān)資料,需要的朋友可以參考下
2016-09-09
Axios設(shè)置token請求頭的三種方式
用戶登錄時,后端會返回一個token,并且保存到瀏覽器的localstorage中,可以根據(jù)localstorage中的token判斷用戶是否登錄,所以當(dāng)發(fā)送請求時,都要攜帶token給后端進(jìn)行判斷,本文給大家介紹了Axios設(shè)置token請求頭的三種方式,需要的朋友可以參考下
2024-02-02
JavaScript偏函數(shù)與柯里化實例詳解
這篇文章主要介紹了JavaScript偏函數(shù)與柯里化,結(jié)合實例形式詳細(xì)分析了JavaScript偏函數(shù)與柯里化的概念、原理、定義、使用方法及相關(guān)操作注意事項,需要的朋友可以參考下
2019-03-03
js 利用image對象實現(xiàn)圖片的預(yù)加載提高訪問速度
我們來學(xué)習(xí)一種名為圖像預(yù)裝載（image preloading）的小技巧來提高圖像訪問速度，一些瀏覽器試圖通過在本地緩存中保存這些圖片來解決此問題，感興趣的朋友可以了解下
2013-03-03