artTemplate的使用
引言
腾讯的前端模板引擎,不逊于doT.js
1.引入
<script type="text/javascript" src="../plugin/artTemplate/template.js"></script>
<!-- jquery 移动端替代品 -->
<script type="text/javascript" src="../script/zepto.min.js"></script>
<!--<script type="text/javascript" src="../script/jquery.min.js"></script>-->
2.代码
<div id="content"></div>
<script id="test" type="text/html">
<h1>{{title}}</h1>
<ul>
{{each list as value i}}
<li>索引 {{i + 1}} :{{value}}</li>
{{/each}}
</ul>
</script>
<script>
var data = {
title: '标签',
list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
};
var html = template('test', data);
document.getElementById('content').innerHTML = html;
</script>
3.结果

artTemplate的使用的更多相关文章
- 性能卓越的js模板引擎--artTemplate
artTemplate能够将数据与View视图的分离,充分利用 javascript 引擎特性,使得其性能无论在前端还是后端都有极其出色的表现. 在 chrome 下渲染效率测试中分别是知名引擎 Mu ...
- JavaScript模板引擎artTemplate.js——结语
再次首先感谢模板的作者大神,再次放出github的地址:artTemplate性能卓越的js模板引擎 然后感谢博客园的一位前辈,他写的handlebars.js模板引擎教程,对我提供了很大的帮助,也是 ...
- 【JavaScript】ArtTemplate个人的使用体验。
据说ArtTemplate是腾讯的,感觉这东西真不错,使用方便,用起来很简单,哈哈.腾讯也不完全只是坑爹啊. ArtTemplate 使用是,正常引入js,这个自然不用说.这东西啥时候使用呢?我觉得这 ...
- JS 模板引擎 BaiduTemplate 和 ArtTemplate 对比及应用
最近做项目用了JS模板引擎渲染HTML,JS模板引擎是在去年做项目是了解到的,但一直没有用,只停留在了解层面,直到这次做项目才用到,JS模板引擎用了两个 BaiduTemplate 和 ArtTemp ...
- artTemplate模板引擎学习实战
在我的一篇关于智能搜索框异步加载数据的文章中,有博友给我留言,认为我手写字符串拼接效率过低,容易出错.在经过一段时间的摸索和学习之后,发现现在拼接字符串的方法都不在是自己去书写了,而是使用Javasc ...
- JavaScript模板引擎artTemplate.js——两种方法实现性别的判定
template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...
- JavaScript模板引擎artTemplate.js——如何引入模板引擎?
artTeamplate.js在github上的地址:artTemplate性能卓越的js模板引擎 引入模板引擎,就是引入外部javascript啦,并且artTemplate.js不依赖其他第三方库 ...
- JavaScript模板引擎artTemplate.js——为什么使用模板引擎?
作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...
- artTemplate 自动化编译之tmod
一.背景 前端小白的成长历程,一般都会经历html模板的一些问题,jquery template/artTemplate/yayaTemplate等常见的模板使用,这里就不作介绍了. 先谈谈我们为什么 ...
- artTemplate里一个比不上jQuery tmpl模板的地方就是放一个数组进去它不会自动循环.
artTemplate里一个比不上jQuery tmpl模板的地方就是放一个数组进去它不会自动循环.
随机推荐
- 王立平--TF卡
最终知道TF卡是什么了... TF卡又称microSD,是一种极细小的快闪存储器卡,由SanDisk(闪迪)公司发明创立. 这样的卡主要于手机使用.但因它拥有体积极小的长处,随着不断提升的容量. 它慢 ...
- Android UI 优化 使用<include/>和 <merge />标签
使用<include /> 标签来重用layout代码 如果在一个项目中需要用到相同的布局设计,可以通过<include /> 标签来重用layout代码,该标签在Androi ...
- POJ 2771 最大独立集 匈牙利算法
(为什么最大独立集的背景都是严打搞对象的( _ _)ノ|壁) 思路:匈牙利算法 没什么可说的-- // by SiriusRen #include <cstdio> #include &l ...
- ORM框架——Dapper的应用
常见的ORM框架有EF,Dapper,NHibernate 参考:http://shuai7boy.iteye.com/blog/2357339 http://www.cnblogs.com/Sint ...
- FluentAPI关系映射配置
都有哪几种关系? 1vs多,多vs多 1. 概念or关系映射相关方法: 1) 基本套路:this.Has***(o=>o.AAA).With***() 当前这个表和AAA属性的表关系是Has定义 ...
- canvas绘制饼型图
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Comparison of programming paradigms
Main paradigm approaches[edit] The following are widely considered the main programming paradigms, a ...
- Nginx虚拟主机以及自动启动脚本详解
想要部署Nginx虚拟主机,那么首先需要nginx的环境,那么我们一起来看一下吧systemctl stop firewalldiptables -Fsetenforce 01)安装支持软件yum - ...
- EasyUI——DataGrid的自定义单元格点击事件
1.当点击的单元格需要传递参数,并且传递的是row的值时,需要进行转义 function initCompareTable(){ $("#deviceCompareTable"). ...
- vscode快捷键补充
ctrl+enter 快速还到下行并插入一行 ctrl+shift+enter 快速换到上行并插入一行 ctrl+~ ctrl+1 快速在终端与代码区切换 ctrl+i 选中一行 ctrl + p: ...