JSON JQUERY 模板

用JSON从服务器端返回数据已是大家公认的标准,因为它短小精悍,使用方便.可是在客户端再现数据也是一个不小的问题,用javascript处理经常会遇到很繁琐的事.尤其大批量具有相同结构的数据,例如表格,处理方式不尽如意.如果能有一个模板控件,就像服务器端asp.net Gridview或者repeater一样的东西就好很多.最近看到一个非常优秀的解决方案,让我在使用方便的同时不得不为作者的精巧设计而作一番感叹.该解决方案用了区区二十几行代码,实现了别人要用几十甚至上百K的js库所做的工作.它就是John Resig 的 Microtemplating engine.大师Rick Strahl有一篇文章专门对此作了详细讲述(Client Templating with Jquery).我在这里把最核心部分提取出来以方便国人学习。

下面一段程序就是microtemplating engine.

 

如何使用:

1
parseTemplate($("#ItemTemplate").html(),              { name: "rick", address: { street: "32 kaiea", city: "paia"} } );

上面程序所用的模板:

1
<script id="ItemTemplate" type="text/html"> <div>    <div><#= name #></div>    <div><#= address.street #></div> </div></script>

如果想用循环:

 
1
2
3
$.each(dataarray,function(index,dataItem){
parseTemplate($("#ItemTemplate").html(),  dataItem );
})

很简单很精巧吧?

posted @   满堂金  阅读(934)  评论(3编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示