javascript利用初始化數(shù)據(jù)裝配模版的實(shí)現(xiàn)代碼
更新時間：2010年11月17日 20:28:03 作者：
實(shí)現(xiàn)一個通用方法，使用初始化數(shù)據(jù)來裝配模版。需要的朋友可以參考下。
var list = [{id:1, name:"czone", age:21}, {id:2, name:'czonechan', age:21}];
var template ='<div id="p$id"><span class="name">$name</span><span class="age">$age</span></div>';
實(shí)現(xiàn)一個通用方法，使用初始化數(shù)據(jù)來裝配模版。
function displayTemplate(list,template){
var result="";
for(var i=0,l=list.length;i<l;i++){
var temp=template;
for(var k in list[i])
{
var reg=new RegExp("\\$"+k,"g");
temp=temp.replace(reg,function(w){
return list[i][k];
})
}
result+=temp;
}
return result;
}
var template ='<div id="p$id"><span class="name">$name</span><span class="age">$age</span></div>';
實(shí)現(xiàn)一個通用方法，使用初始化數(shù)據(jù)來裝配模版。
復(fù)制代碼 代碼如下:
function displayTemplate(list,template){
var result="";
for(var i=0,l=list.length;i<l;i++){
var temp=template;
for(var k in list[i])
{
var reg=new RegExp("\\$"+k,"g");
temp=temp.replace(reg,function(w){
return list[i][k];
})
}
result+=temp;
}
return result;
}
相關(guān)文章
inner join 內(nèi)聯(lián)與left join 左聯(lián)的實(shí)例代碼
這篇文章主要介紹了inner join 內(nèi)聯(lián)與left join 左聯(lián)的實(shí)例代碼,需要的朋友可以參考下2017-09-09
這篇文章主要介紹了使用electron制作滿屏心特效的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
JS中map與forEach無法跳出循環(huán)及every和some的使用
在我們平時使用習(xí)慣中,for循環(huán)里要跳出整個循環(huán)是使用break,但在數(shù)組中用forEach循環(huán)或者map如要退出整個循環(huán)使用break會報(bào)錯,使用return也不能跳出循環(huán),下面這篇文章主要介紹了關(guān)于JS中map與forEach無法跳出循環(huán)及every和some的使用的相關(guān)資料,需要的朋友可以參考下2023-05-05
由 element.appendChild(newNode) ,談開去
由 element.appendChild(newNode) ,談開去...2006-11-11
這篇文章主要介紹了TypeScript接口，接口的作用就是為這些類型命名和為你的代碼或第三方代碼定義契約。下面我們一起進(jìn)入文章看看TypeScript接口得具體定義吧,需要的朋友也可以參考一下2021-12-12
javascript數(shù)組的擴(kuò)展實(shí)現(xiàn)代碼集合
非常不錯的javascript數(shù)據(jù)功能增強(qiáng)函數(shù)2008-06-06
js css 實(shí)現(xiàn)遮罩層覆蓋其他頁面元素附圖
實(shí)現(xiàn)遮罩層的方法有很多，但大多都是使用js css來實(shí)現(xiàn)的，本例也實(shí)現(xiàn)一個，效果還不錯，喜歡的朋友可以感受下2014-09-09
這篇文章主要為大家介紹了GoJs連線繪圖模板Link使用示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-04-04
js 實(shí)現(xiàn)的可折疊留言板(附源碼下載)
留言板想必大家都有見過吧，但是可以折疊的卻不是很多，恰好本文提供一個比較不錯的可折疊留言板，感興趣的朋友可以學(xué)習(xí)下2014-07-07
這篇文章主要介紹了詳解小程序input框失焦事件在提交事件前的處理，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05