JQuery.tmpl()的用法
动态请求数据来更新页面是现在非常常用的方法,现在通过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()的用法的更多相关文章
- jquery.tmpl.min.js--前端实现模版--数据绑定--详解
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jquery tmpl 详解(转)
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- Jquery tmpl详解
Jquery tmpl是动态请求数据来更新页面非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 ...
- jQuery .tmpl() 用法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jquery.tmpl.js 模板引擎用法
1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type ...
- jQuery tmpl用法总结
之前很是头疼循环数据的渲染,搞一大堆的命名,一点点的赋值,很是麻烦,今天学习了一下jQuery插件tmpl,下面抛出一些使用方法,供以后参考: 官方网址:http://web.archive.org/ ...
- jquery tmpl 详解
官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意 ...
- [转载]jquery tmpl使用方法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jQuery .tmpl(), .template()学习资料小结
昨晚无意中发现一个有趣的jQuery插件.tmpl(),其文档在这里.官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options ...
随机推荐
- Jmeter Html 报告优化
转载自南风_real博客园:http://www.cnblogs.com/jaychang/p/5881525.html 但是最近在查阅相关资料时,发现基本都是重复一篇文章Jmeter使用笔记之htm ...
- 03.product.js
/* item.jd.com Compressed by uglify Author:keelii Date: 2014-08-05 6:52:26 [PM] */ function insertSc ...
- 苹果safari浏览器登陆时Cookie无法保存的问题
Safari浏览器不支持将非ASCII字符存入Cookie,所以中文在保存的时候就会出问题,分号(";")也不能存在Cookie中,所以需要通过方法去除内容中的分号,在Cookie ...
- Delphi 中 paramstr 的用法及参数意义
原型 function paramstr(i:index):string 对于任何application paramstr(0)都默认代表的是应用程序的绝对路径.那 ...
- Ext中 get、getDom、getCmp的区别
getDom方法能够得到文档中的DOM节点,该方法中包含一个参数,该参数可以是DOM节点的id.DOM节点对象或DOM节点对应的Ext元素(Element)等. (与getElementById是一个 ...
- 常用正规js
1,得到网页上的链接地址: string matchString = @"<a[^>]+href=\s*(?:'(?<href>[^']+)'|"" ...
- Package 'DXCore for Visual Studio' has failed to load properly
Since installing 13.1 I get Package 'DXCore for Visual Studio' has failed to load properly error wh ...
- OC基础笔记目录
OC基础(1) Objective-C简介 OC和C对比 第一个OC程序 面向对象思想 OC基础(2) 类与对象 类的设计 第一个OC类 对象方法的声明和实现 类方法的声明和实现 OC基础(3) 对象 ...
- [系统] 安装Ubuntu 双系统 - 失败
因为工作原因, 所以需要装ubuntu系统. 在网络上查了一下, 一般都是使用U盘安装. 但是由于手头上既没有U盘又没有光盘,只能用硬盘安装了. 查一下, 使用wubi安装方式从硬盘安装, 非常方便. ...
- 断言--NSAssert
NSAssert()是一个宏,用于开发阶段调试程序中的Bug,通过为NSAssert()传递条件表达式来断定是否属于Bug,满足条件返回真值,程序继续运行,如果返回假值,则抛出异常,并切可以自定义异常 ...