js模板引擎art-Template(以前的artTemplate)
使用js、jquery动态生成html会非常麻烦。现在的模板引擎可以很简单的解决这个问题。比如腾讯出的art-Template
官网:http://aui.github.io/art-template/zh-cn/
下载:template-web.js(gzip: 6kb)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<!--用于展示模版的位置-->
<div id="area"></div>
<script src="http://aui.github.io/art-template/js/template-engines/template-web.js"></script>
<!--用于存放模版-->
<script id="template" type="text/html">
<div>
<!--升级后:Template upgrade: {each object as value index} -> {each object value index} -->
{{each content value }}
<h1>{{ value.province }}</h1>
{{each value.city city }}
<p>{{city}}</p>
{{/each }}
{{/each }}
</div>
</script>
<!--用于渲染模版-->
<script>
var data = {
content: [
{ province: '四川', city: ['成都', '绵阳', '自贡'] },
{ province: '广东', city: ['广州', '东莞', '佛山'] },
{ province: '海南', city: ['海口', '三亚'] }
]
};
var html = template('template', data);
document.getElementById('area').innerHTML = html;
</script>
</body>
</html>
参考:https://www.awesomes.cn/repo/aui/arttemplate
js模板引擎art-Template(以前的artTemplate)的更多相关文章
- js 模板引擎 -Art Template
一个例子涵盖所有: <!doctype html> <html> <head> <meta charset="UTF-8"> < ...
- js模板引擎art-template使用方法
art-template是款性能卓越的 js 模板引擎 https://aui.github.io/art-template/ 特性 拥有接近 JavaScript 渲染极限的的性能 调试友好:语法. ...
- JS 模板引擎 BaiduTemplate 和 ArtTemplate 对比及应用
最近做项目用了JS模板引擎渲染HTML,JS模板引擎是在去年做项目是了解到的,但一直没有用,只停留在了解层面,直到这次做项目才用到,JS模板引擎用了两个 BaiduTemplate 和 ArtTemp ...
- js模板引擎--artTemplate
js模板引擎--artTemplate 以前研究过一段时间的handlebars,但因为其渲染性能略逊于腾讯的artTemplate(在artTemplate的GitHub官网上有推荐的性能测试地址) ...
- js模板引擎之artTemplate
http://www.cnblogs.com/52fhy/p/5393673.html artTemplate 不支持requre.js,悲剧啊,只能用juicer啊 这个还是比较有名的. 简介: a ...
- doT js 模板引擎【初探】要优雅不要污
js中拼接html,总是感觉不够优雅,本着要优雅不要污,决定尝试js模板引擎. JavaScript 模板引擎 JavaScript 模板引擎作为数据与界面分离工作中最重要一环,越来越受开发者关注. ...
- js模板引擎
js模板引擎包括如下: template 官方参考:http://aui.github.io/artTemplate BaiduTemplate 官方参考:http://baidufe.github. ...
- 调研js模板引擎
js模板引擎越来越多的得到应用,如今已经出现了几十种js模板引擎,国内各大互联网公司也都开发了自己的js模板引擎(淘宝的kissy template,腾讯的artTemplate,百度的baiduTe ...
- js模板引擎介绍搜集
js模板引擎越来越多的得到应用,如今已经出现了几十种js模板引擎,国内各大互联网公司也都开发了自己的js模板引擎(淘宝的kissy template,腾讯的artTemplate,百度的baiduTe ...
- 浅析js模板引擎
js模板引擎越来越多的得到应用,如今已经出现了几十种js模板引擎,国内各大互联网公司也都开发了自己的js模板引擎(淘宝的kissy template,腾讯的artTemplate,百度的baiduTe ...
随机推荐
- 如何能让MAC和PC都能读写移动硬盘
Macbook Pro 移动硬盘 希捷硬盘就不用,有专业适用于苹果的软件. 1.在“LaunchPad”中找到并打开“磁盘工具”,在“磁盘工具”中可以看到移动硬盘的几个分区 2.选择一个分区后,选择“ ...
- python 各种推导式玩法
推导式套路 除了最简单的列表推导式和生成器表达式,其实还有字典推导式.集合推导式等等. 下面是一个以列表推导式为例的推导式详细格式,同样适用于其他推导式. variable = [out_exp_re ...
- Spring Boot中的initializers的作用分析
在SpringApplication的实例属性中有一个初始器的属性:List<ApplicationContextInitializer<?>> initializers ,这 ...
- Windows PowerShell 入門(5)-制御構文
Windows PowerShellにおける制御構文について学びます.数ある制御構文の中でもSwitch文は.他の言語に比べ豊富な機能が用意されています. 対象読者 Windows PowerShel ...
- [转]JS根据useAgent来判断edge, ie, firefox, chrome, opera, safari 等浏览器的类型及版本
js根据浏览器的useAgent来判断浏览器的类型 userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值. JavaScript语法:navigator.use ...
- 7-Links
Use the <a> element to define a link Use the href attribute to define the link address Use the ...
- Spring Boot (一): Spring Boot starter自定义
前些日子在公司接触了spring boot和spring cloud,有感于其大大简化了spring的配置过程,十分方便使用者快速构建项目,而且拥有丰富的starter供开发者使用.但是由于其自动化配 ...
- Java红黑树详谈
定义 红黑树的主要是想对2-3查找树进行编码,尤其是对2-3查找树中的3-nodes节点添加额外的信息.红黑树中将节点之间的链接分为两种不同类型,红色链接,他用来链接两个2-nodes节点来表示一个3 ...
- Modbus库开发笔记之十:利用协议栈开发Mosbus RTU Slave应用
上一节我们使用协议占开发了一个Modbus TCP Server应用.接下来我们使用协议栈在开发一个基于串行链路的Mosbus RTU Slave应用. 根据前面对协议栈的封装,我们需要引用Modbu ...
- socket通讯---TcpClient
IPHostEntry ipe = Dns.GetHostEntry(Dns.GetHostName()); IPAddress ipa = ipe.AddressList[0]; System.Ne ...