jquery 模板的应用示例


Posted in Javascript onNovember 12, 2013
<body> <h1>天地盟主 QQ:467713292</h1> 
<!-- 将模版放置的位置标签 --> 
<div id="contactContainer"></div> 
<!-- 定义模板的内容布局 和定义显示的字段 --> 
<script id="contactTemplate" type="text/html"> 
<div> 
姓名: {{= name }} <br /> 
手机号: {{= phone }} 
</div> 
</script> 
//引用两个js

<script src="Scripts/jquery-1.4.2.js" type="text/javascript"></script> 
<script src="Scripts/jquery.tmpl.js" type="text/javascript"></script> 
<script type="text/javascript"> var contacts = [ 
{name:"天地盟主", phone:"467713292"}, 
{name:"与狼共舞", phone: "206-555-7878" }, 
{name:"程序员中的菜鸟", phone: "415-555-8888" } 
]; 
//只需要这样一句话就可以将上面定义好的json数据填充到模板里 呈现出来

$("#contactTemplate").render(contacts).appendTo("#contactContainer"); 
</script> 
</body>
Javascript 相关文章推荐
jquery validator 插件增加日期比较方法
Feb 21 Javascript
javascript 学习笔记(一)DOM基本操作
Apr 08 Javascript
js数组转json并在后台对其解析具体实现
Nov 20 Javascript
Tab切换组件(选项卡功能)实例代码
Nov 21 Javascript
JavaScript编写连连看小游戏
Jul 07 Javascript
JavaScript数组对象赋值用法实例
Aug 04 Javascript
window.open打开窗口被拦截的快速解决方法
Aug 04 Javascript
js制作可以延时消失的菜单
Jan 13 Javascript
bootstrap table使用入门基本用法
May 24 Javascript
使用JS动态显示文本
Sep 09 Javascript
浅谈React深度编程之受控组件与非受控组件
Dec 26 Javascript
深入浅析AngularJs模版与v-bind
Jul 06 Javascript
jQuery 无刷新分页实例代码
Nov 12 #Javascript
JS图片切换的具体方法(带缩略图版)
Nov 12 #Javascript
JS实现遮罩层效果的简单实例
Nov 12 #Javascript
javascript静态页面传值的三种方法分享
Nov 12 #Javascript
javascript的渐进增强与平稳退化浅谈
Nov 12 #Javascript
JavaScrip实现PHP print_r的数功能(三种方法)
Nov 12 #Javascript
JavaScript中的字符串操作详解
Nov 12 #Javascript
You might like
apache和php之间协同工作的配置经验分享
2013/04/08 PHP
PHP 安全检测代码片段(分享)
2013/07/05 PHP
php导出csv格式数据并将数字转换成文本的思路以及代码分享
2014/06/05 PHP
Codeigniter里的无刷新上传的实现代码
2019/04/14 PHP
多广告投放代码 推荐
2006/11/13 Javascript
JavaScript面向对象编程
2008/03/02 Javascript
JavaScript使用技巧精萃[代码非常实用]
2008/11/21 Javascript
一个很酷的拖动层的js类,兼容IE及Firefox
2009/06/23 Javascript
jquery 延迟执行实例介绍
2013/08/20 Javascript
a标签click和href执行顺序探讨
2014/06/23 Javascript
js实现三张图(文)片一起切换的banner焦点图
2015/08/25 Javascript
JS实现的3D拖拽翻页效果代码
2015/10/31 Javascript
基于JavaScript的操作系统你听说过吗?
2016/01/28 Javascript
JS Select下拉框(支持输入模糊查询)
2017/02/04 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
NodeJS收发GET和POST请求的示例代码
2017/08/25 NodeJs
JQuery搜索框自动补全(模糊匹配)功能实现示例
2019/01/08 jQuery
微信小程序登录时如何获取input框中的内容
2019/12/04 Javascript
tracking.js实现前端人脸识别功能
2020/04/16 Javascript
[04:02]2014DOTA2国际邀请赛 BBC每日综述中国战队将再度登顶
2014/07/21 DOTA
MySQL最常见的操作语句小结
2015/05/07 Python
基于python脚本实现软件的注册功能(机器码+注册码机制)
2016/10/09 Python
Python遍历numpy数组的实例
2018/04/04 Python
python验证码识别教程之灰度处理、二值化、降噪与tesserocr识别
2018/06/04 Python
详解python:time模块用法
2019/03/25 Python
Python批量删除只保留最近几天table的代码实例
2019/04/01 Python
详解pandas.DataFrame.plot() 画图函数
2020/06/14 Python
Python 多线程C段扫描、检测 Ping扫描脚本的实现
2020/09/03 Python
实现Python3数组旋转的3种算法实例
2020/09/16 Python
如何使用css3实现一个类在线直播的队列动画的示例代码
2020/06/17 HTML / CSS
Zavvi西班牙:电子游戏、极客服装、Blu-ray、Funko Pop等
2019/05/03 全球购物
波兰多品牌运动商店:StreetStyle24.pl
2020/09/22 全球购物
业务部门经理岗位职责
2014/02/23 职场文书
CSS3实现的文字弹出特效
2021/04/16 HTML / CSS
PyQt5爬取12306车票信息程序的实现
2021/05/14 Python
Python max函数中key的用法及原理解析
2021/06/26 Python