jTemplates用法

1.通过JS获取JSON形式的数据;

2.获取一个HTML模板,与数据相结合,生成页面HTML。

最基础的应用:

1.导入jTemplates.js:
<SCRIPT type="text/javascript" src="JS/jquery-jtemplates.js"></SCRIPT>

2.html中的代码:<div id="jTemplatesTest"></div>

3.模板代码:

< textarea id="template" style="display:none">

你好:{$T.name},你{$T.age}岁了。

</textarea>

4.JS数据:var profile={name:"XXX",age:"24"};

5.调用方法:

$("#jTemplatesTest").setTemplateElement("template");//template指模板容器(这里是textarea)的ID;
也可以直接将innerHtml传入,譬:
var abc ='<textarea id="template" style="display:none">你好:{$T.name},今天你{$T.age}岁了。</textarea>';

$("#jTemplatesTest").setTemplateElement(abc);
$("#jTemplatesTest").processTemplate(profile);//让jTemplatesTest读取profile这个数据。

6.最终输出:<div id="jTemplatesTest">你好:XXX,你24岁了。</div>

循环输出:

数据:

var data = [{age:1,name:'小A'},{age:2,name:'小B'},{age:3,name:'小C'},{age:4,name:'小D'},{age:5,name:'小E'}];


模板:

< textarea id="template" style="display:none">

{#foreach $T as record}

你好:{$T.name},你{$T.record.age}岁了。<br />

{#/for}

</textarea>

调用:

$("#Panel").setTemplateElement("template");
$("#Panel").processTemplate(data);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值