动态请求数据来更新页面是现在非常常用的方法,现在通过Ajax请求返回的数据更多的是json对象,
为了解决js动态拼接数据这方面的问题,JavaScript 也可以利用模版来解决这些问题,比如基于 jQuery 的 jquery.tmpl。

Tmpl提供了几种tag:

${}:等同于{{=}},是输出变量,通过了html编码的。
{{html}}:输出变量html,但是没有html编码,适合输出html代码。
{{if }} {{else}}:提供了分支逻辑。
{{each}}:提供循环逻辑,$value访问迭代变量。

jquery tmpl的使用方法:
模板定义:
${}为json的键的值,必须要填写正确,和<%#Eval()%>这个作用一样

先设置好模板:

    <script id="movieTemplate" type="text/x-jquery-tmpl">
<li>
<b>${Name}</b> (${ReleaseYear})
</li>
</script>

再看数据源:

var movies = [
{ Name: "The Red Violin", ReleaseYear: "" },
{ Name: "Eyes Wide Shut", ReleaseYear: "" },
{ Name: "The Inheritance", ReleaseYear: "" }
];

最后Script 代码:

<script src="/js/jquery.tmpl.min.js"></script>

     $( "#movieTemplate" ).tmpl( movies )  //获得替换占位符后的值
.appendTo( "#movieList" );

JQuery.tmpl()的用法的更多相关文章

  1. jquery.tmpl.min.js--前端实现模版--数据绑定--详解

    动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...

  2. jquery tmpl 详解(转)

    动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...

  3. Jquery tmpl详解

    Jquery tmpl是动态请求数据来更新页面非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 ...

  4. jQuery .tmpl() 用法

    动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...

  5. jquery.tmpl.js 模板引擎用法

    1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type ...

  6. jQuery tmpl用法总结

    之前很是头疼循环数据的渲染,搞一大堆的命名,一点点的赋值,很是麻烦,今天学习了一下jQuery插件tmpl,下面抛出一些使用方法,供以后参考: 官方网址:http://web.archive.org/ ...

  7. jquery tmpl 详解

    官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意 ...

  8. [转载]jquery tmpl使用方法

    动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...

  9. jQuery .tmpl(), .template()学习资料小结

    昨晚无意中发现一个有趣的jQuery插件.tmpl(),其文档在这里.官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options ...

随机推荐

  1. 20145305 《Java程序设计》第9周学习总结

    教材学习内容总结 1.厂商在操作JDBC驱动程序时,依方式可将驱动程序分为4种类型: JDBC-ODBC Bridge Driver Native API Driver JDBC-Net Driver ...

  2. [ActionScript3.0] 为内建类添加方法

    通过使用prototype在继承内建类特性的同时加入新方法 Array.prototype.removeElement = function (item:*):void { var index:int ...

  3. Delphi同步互斥总结

    多个线程同时访问一个共享资源或数据时,需要考虑线程同步,Synchronize()是在一个隐蔽的窗口里运行,如果在这里你的任务很繁忙,你的主窗口会阻塞掉:Synchronize()只是将该线程的代码放 ...

  4. ubuntu 14.10 安装 zabbix

    在ubuntu 14.10 上部署 zabbix 2.x 基本软件包安装 既然是ubuntu系统,当然要用好apt-get神器. 参考教程 URL:http://blog.csdn.net/cloud ...

  5. ZOJ 3407 Doraemon's Cake Machine [数学]

    题意: 最多有2000组测试样例,每组样例代表n,m; n代表要把蛋糕平分的份数,m代表必须进行多少次操作. 一共有三种操作 1.竖切   经过蛋糕圆心,将蛋糕整个向下切. 2.横切   平行于蛋糕平 ...

  6. poj 1125 Stockbroker Grapevine dijkstra算法实现最短路径

    点击打开链接 Stockbroker Grapevine Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 23760   Ac ...

  7. [HDU 4419] Colourful Rectangle (扫描线 矩形面积并)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4419 题目大意:比矩形面积并多了颜色,问染成的每种颜色的面积. 矩形面积并的扫描线维护的是长度,这道题 ...

  8. 解决oralce 11g dg搭建报错:ORA-16664、ORA-16714、ORA-16810问题--转

    下面不是小编错误报告只是转了网络一篇,同时也解决了我的问题所以复制过来给各位参考. 最近在弄11g的dg时,遇到如下问题,记录下.首先在主上查看报如下错误: DGMGRL> show confi ...

  9. IIS报错,App_global.asax.×××.dll拒绝访问

    解决方案: ①找到C:\Windows下的temp文件夹 ②属性->安全->编辑->添加IIS_IUSERS,给其添加上可读写的权限,然后应用,确定即可

  10. HDU1272

    http://acm.split.hdu.edu.cn/showproblem.php?pid=1272 对于这道题,只要找出形成的图是不是连通无环的图即可.即是判断输入的两个点是否来自同一个父亲结点 ...