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(集合图形)来丰富节点内部的显示内容.而有些时候需要在节点内部上传一些说明材料,恰好这些材料又是图片材料.如果拿图片和节点信息对照观看的话,一一对照会特别麻烦.如果能够在节点内部显示缩略图的话.在信息
随机推荐
- Mootools 1.2教程 输入过滤第一部分(数字)
- 探讨.get .post .ajax ztree 还有后台servlet传递数据的相关知识
- 一个即时表单验证的javascript代码
- AngularJS学习笔记(三)数据双向绑定的简单实例
- iOS实现自定义日期选择器示例
- JQery jstree 大数据量问题解决方法
- PHP导出Excel实例讲解
- jsp Hibernate 函数简介
- js中的前绑定和后绑定详解
- gearman队列持久化引发的问题及解决方法
- Python获取单个程序CPU使用情况趋势图
- 如何在网站中插播广告?
- DIV+CSS网页另类上下布局的实例代码
- 详解MongoDB中用sharding将副本集分配至服务器集群的方法
- jquery tab插件制作实现代码
- 查看大图功能代码jquery版
- JavaScript中的函数重载深入理解
- JavaEE实现文件下载
- Python中将变量按行写入txt文本中的方法
- 基于vue如何发布一个npm包的方法步骤