jquery 模板的应用示例
<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>
相关推荐
-
jquery 模板的应用示例
复制代码 代码如下: <body> <h1>天地盟主 QQ:467713292</h1> <!-- 将模版放置的位置标签 --> <div id="contactContainer"></div> <!-- 定义模板的内容布局 和定义显示的字段 --> <script id="contactTemplate" type="text/html"> <
-
常用的jquery模板插件——jQuery Boilerplate介绍
在初次进行jquery插件开发时,我们往往无从下手,当然我们可以按照jquery官方提供的格式进行简单的插件开发,但是很多时候往往不尽完美,一不小心,就造出一个很"烂"的插件:难以维护.难以扩展.使用繁琐.性能不佳...当我们在不断的实践中,慢慢积累下来时,有些问题得到了有效的避免,但也带来了新的问题:在众多纷杂的jquery插件开发模式中,究竟哪一种模式才是最好的呢? 如果能提供一个模板,通过一定的约束和规范为开发者解决在jquery插件开发中的"迷惘"那该多好!
-
浅谈原生JS实现jQuery的animate()动画示例
本文介绍了浅谈原生JS实现jQuery的animate()动画示例,希望此文章对各位有所帮助. 参数介绍: obj 执行动画的元素 css JSON数值对,形式为"{属性名: 属性值}",指要执行动画的书序及其对应值 interval 属性每执行一次改变的时间间隔 speedFactor 速度因子,使动画具有缓冲效果,而不是匀速不变(speedFactor为1) func 执行完动画后的回调函数 注意: 必须为每一个元素分别添加一个定时器,否则会互相影响. cur != css[arr
-
jQuery模板技术和数据绑定实现代码
好消息来了,微软开发出了这样的框架,这是对jQuery的一个扩展,从此以后要在浏览器上动态显示服务器端Web Service返回的数据将变得如同用服务器端控件显示数据一样容易. 这个技术就叫jQuery templates and data linking ,这是微软对jQuery做的一个扩展.这种扩展需要jQuery官方的审核,然后才能被包含在jQuery中.据ScottGu的博客上说,此扩展正在等待审核阶段.但是这些功能却是非常强大而且实用,我就先把它转过来了,先睹为快. 在编写AJAX应用
-
JQuery模板插件 jquery.tmpl 动态ajax扩展
在上一篇JQuery模板插件-jquery.tmpl中介绍了这款插件.有时我们需要去动态的ajax去加载模板,或者数据,根据url参数或者其他信息加载不同的模板,数据.在我的某个项目中有这个需求,所以特地写成jquery工具函数,加入了本地数据和ajax数据加载模板,数据的方式. 参数说明: Tmpl: function(template, data, fun) 1:template: 1): url: 为ajax的加载url,ajax当且仅当remote= true时候加载. 2):data:
-
jQuery 动态粒子效果示例代码
1.js部分 var RENDERER = { PARTICLE_COUNT : 1000, PARTICLE_RADIUS : 1, MAX_ROTATION_ANGLE : Math.PI / 60, TRANSLATION_COUNT : 500, init : function(strategy){ this.setParameters(strategy); this.createParticles(); this.setupFigure(); this.reconstructMetho
-
python 爬取免费简历模板网站的示例
代码 # 免费的简历模板进行爬取本地保存 # http://sc.chinaz.com/jianli/free.html # http://sc.chinaz.com/jianli/free_2.html import requests from lxml import etree import os dirName = './resumeLibs' if not os.path.exists(dirName): os.mkdir(dirName) headers = { 'User-Agent
-
element-ui封装一个Table模板组件的示例
大家在做后台管理系统的时候,写的最多的可能就是表格页面了,一般分三部分:搜索功能区.表格内容区和分页器区.一般这些功能都是使用第三方组件库实现,比如说element-ui,或者vuetify.这两个组件库都各有各的优点,但就table组件来说,我还是比较喜欢vuetify的实现,不用手写一个个column,只要传入headers的配置数组就行,甚至分页器都内置在了table组件里,用起来十分方便.有兴趣可以看看:vuetify data table. 上面是一个经典的用element-ui开发的
-
python jinja2模板的使用示例
模板的用处 jinja2 可以用来修改配置文件,把配置文件的关键地方可以用变量来进行替换 模板语法 模板语法和django的模板语法差不多 在jinja2中,存在三种语法: 控制结构{% %} 变量取值{{ }} 注释{# #} for 循环 {% for user in users %} {{user.username}} {% endfor %} 迭代字典 {% for key,value in my_dict.iteritems() %} {{ key }} {{ value }} {%
-
GoJs 图片绘图模板Picture使用示例详解
目录 前言 go.Picture的使用 go.Picture的属性 width.height.desiredSize属性 source属性 flip属性 imageStretch.imageAlignment属性 拓展 结语 前言 前面已经说过了通过go.TextBlock(文本)和go.Shape(集合图形)来丰富节点内部的显示内容.而有些时候需要在节点内部上传一些说明材料,恰好这些材料又是图片材料.如果拿图片和节点信息对照观看的话,一一对照会特别麻烦.如果能够在节点内部显示缩略图的话.在信息
随机推荐
- js window.onload 加载多个函数和追加函数详解
- jQuery插件Slider Revolution实现响应动画滑动图片切换效果
- python读取json文件并将数据插入到mongodb的方法
- Winform之TextBox输入日期格式验证yyyy-mm-dd
- ajax+asp无限级分类树型结构(带数据库)
- 星外系统IIS日志分析常用的几个命令小结
- js获取Treeview选中的节点(C#选中CheckBox项)
- js实现登录框鼠标拖拽效果
- Python学习思维导图(必看篇)
- JS数组合并push与concat区别分析
- 右键发送(sendto),创建快捷方式到自定义的位置 的vbs
- lua操作excel方法分享
- Lua常用时间函数使用实例
- 基于jquery的3d效果实现代码
- 关于PHP语言构造器介绍
- 部署到iis后无法加载运行CSS文件的解决方法
- Android RecyclerView的Item点击事件实现整理
- Python人脸识别初探
- Android编程设计模式之命令模式详解
- python实现图书管理系统