artTemplate是腾讯公司的js模板引擎,性能、语法以及错误处理非常的优秀,它采用预编译方式让性能有了质的飞跃,并且充分利用 javascript 引擎特性,使得其性能无论在前端还是后端都有极其出色的表现。在 chrome 下渲染效率测试中分别是知名引擎 Mustache 与 micro tmpl 的 25 、 32 倍。
安装与使用
引用简洁语法的引擎版本,例如:
<script src="dist/template.js"></script>
表达式
简写表达式由{{ 与 }}构成
对内容编码输出:
编码输出:
{{content}}
不编码输出:
{{#content}}
编码可以防止数据中含有 HTML 字符串,避免引起 XSS 攻击。
条件表达式
{{if admin}}
admin
{{else if code > 0}}
master
{{else}}
error
{{/if}}
遍历表达式
无论数组或者对象都可以用 each 进行遍历。
{{each list as value index}}
<li>{{index}} - {{value.user}}</li>
{{/each}}
亦可以被简写:
{{each list}}
<li>{{$index}} - {{$value.user}}</li>
{{/each}}
模板包含表达式
用于嵌入子模板。
{{include 'template_name'}}
子模板默认共享当前数据,亦可以指定数据:
{{include 'template_name' news_list}}
辅助方法
使用
template.helper(name, callback)
注册公用辅助方法:
template.helper('dateFormat', function (date, format) { // .. return value;});
模板中使用的方式:
{{time | dateFormat:'yyyy-MM-dd hh:mm:ss'}}
支持传入参数与嵌套使用:
{{time | say:'cd' | ubb | link}}
演示例子
基本例子
不转义HTML
在javascript中存放模板
嵌入子模板(include)
访问外部公用函数(辅助方法)