快捷導(dǎo)航

如何使用JS在HTML中自定義字符串格式化

更新時(shí)間：2017年07月20日 15:30:20 作者：jack-boy

在JavaScript中雖沒(méi)有類(lèi)似的方法，但我們可以利用字符串的replace方法自定義字符串的格式化方法。下面通過(guò)本文給大家分享使用JS在HTML中自定義字符串格式化的方法，需要的的朋友參考下吧

Python中支持字符串格式化，其基本形式如下：

 str = "I'm %s, %s years old." % ('jack', 19)
 print(str) 
 #結(jié)果：
 I'm jack, 19 years old.

在JavaScript中雖沒(méi)有類(lèi)似的方法，但我們可以利用字符串的replace方法自定義字符串的格式化方法：

<script>
 $(function () {
   /*自定義字符串格式化*/
  String.prototype.Format = function (args) {
   /*this代表要調(diào)用Format方法的字符串*/
   /*replace的第一個(gè)參數(shù)為正則表達(dá)式，g表示處理匹配到的所有字符串，在js中使用//包起來(lái)*/
   /*replace的第二個(gè)參數(shù)為匹配字符串的處理，k1匹配結(jié)果包含{}，k2只保留{}內(nèi)的內(nèi)容*/
   var temp = this.replace(/\{(\w+)\}/g, function (k1, k2) {
    console.log(k1, k2);
    /*replace將匹配到的k2用參數(shù)args替換后賦給新變量temp*/
    return args[k2];
   });
   /*自定義方法Format將格式化后的字符串返回*/
   return temp;
  };
 }
</script>

驗(yàn)證：

總結(jié)

以上所述是小編給大家介紹的使用JS在HTML中自定義字符串格式化，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

JS的空值合并運(yùn)算符(??)的使用
空值合并運(yùn)算符是一個(gè)邏輯運(yùn)算符,當(dāng)左側(cè)的操作數(shù)為null或undefined時(shí),會(huì)返回右側(cè)操作數(shù),否則返回左側(cè)操作數(shù),本文就來(lái)詳細(xì)的介紹一下如何使用
2023-12-12
如何在Web頁(yè)面上直接打開(kāi)、編輯、創(chuàng)建Office文檔
如何在Web頁(yè)面上直接打開(kāi)、編輯、創(chuàng)建Office文檔...
2007-03-03
js控制iframe的高度/寬度讓其自適應(yīng)內(nèi)容
這篇文章主要介紹了如何使用js控制iframe的高度/寬度讓其自適應(yīng)內(nèi)容,需要的朋友可以參考下
2014-04-04
關(guān)于IE7 IE8彈出窗口頂上
關(guān)于IE7.8.彈出窗口頂上...
2008-12-12
小程序?qū)崿F(xiàn)Token生成與驗(yàn)證
本文主要介紹了小程序?qū)崿F(xiàn)Token生成與驗(yàn)證，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-12-12
基于postman獲取動(dòng)態(tài)數(shù)據(jù)過(guò)程詳解
這篇文章主要介紹了基于postman獲取動(dòng)態(tài)數(shù)據(jù)過(guò)程詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-09-09
js省市聯(lián)動(dòng)效果完整實(shí)例代碼
這篇文章主要介紹了js省市聯(lián)動(dòng)效果完整實(shí)例代碼,涉及JavaScript數(shù)組的定義與遍歷技巧,代碼非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-12-12
JS+HTML5實(shí)現(xiàn)上傳圖片預(yù)覽效果完整實(shí)例【測(cè)試可用】
這篇文章主要介紹了JS+HTML5實(shí)現(xiàn)上傳圖片預(yù)覽效果,結(jié)合完整實(shí)例形式分析了javascript上傳圖片本地預(yù)覽的具體操作步驟與相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2017-04-04
JavaScript+HTML5 canvas實(shí)現(xiàn)放大鏡效果完整示例
這篇文章主要介紹了JavaScript+HTML5 canvas實(shí)現(xiàn)放大鏡效果,結(jié)合完整實(shí)例形式分析了javascript+HTML5 canvas針對(duì)圖片元素的獲取、響應(yīng)鼠標(biāo)事件變換元素屬性相關(guān)操作技巧,需要的朋友可以參考下
2019-05-05
Google的跟蹤代碼動(dòng)態(tài)加載js代碼方法應(yīng)用
Google的跟蹤代碼動(dòng)態(tài)加載js代碼，需要的朋友可以參考下
2012-11-11