1、 添加辅助方法

``template.helper(name, callback)``辅助方法一般用来进行字符串替换,如 UBB 替换、脏话替换等。

例如扩展一个UBB替换方法:

 template.helper('$ubb2html', function (content) {
return content
.replace(/\[b\]([^\[]*?)\[\/b\]/igm, '<b>$1</b>')
.replace(/\[i\]([^\[]*?)\[\/i\]/igm, '<i>$1</i>')
.replace(/\[u\]([^\[]*?)\[\/u\]/igm, '<u>$1</u>')
.replace(/\[url=([^\]]*)\]([^\[]*?)\[\/url\]/igm, '<a href="$1">$2</a>')
.replace(/\[img\]([^\[]*?)\[\/img\]/igm, '<img src="$1" />');
});

在模板中的使用方式:

<%=$ubb2html(content) %>

注意:引擎不会对辅助方法输出的 HTML 字符进行转义。

2、嵌入子模板

``<%include(id, [data])%>``语句可以嵌入子模板,其中第二个参数是可选的,它默认传入当前的数据。

3、不转义HTML

模板引擎默认数据包含的 HTML 字符进行转义以避免 XSS 漏洞,若不需要转义的地方可使用``==``。

例如:<%==value%>

若需要关闭默认转义,可以设置``template.isEscape = false``。

4、 在js中存放模板

var source =
'<ul>'
+ '<% for (var i = 0; i < list.length; i ++) { %>'
+ '<li>索引 <%= i + 1 %> :<%= list[i] %></li>'
+ '<% } %>'
+ '</ul>'; var data = {
list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
}; var render = template.compile(source);
var html = render(data);
document.getElementById('content').innerHTML = html;

5、模板编码规范
  1、不能使用 javascript 关键字作为模板变量(包括 ECMA5 严格模式下新增的关键字):

  2、模板运行在沙箱中,内部无法访问外部变量,除非给模板定义辅助方法。例如: template.helper('Math', Math)

所有演示例子:http://aui.github.com/artTemplate/demo/index.html

本文章内容摘抄自:http://www.lvtao.net/web/javascript-artTemplate.html

artTemplate模板使用补充的更多相关文章

  1. artTemplate模板引擎学习实战

    在我的一篇关于智能搜索框异步加载数据的文章中,有博友给我留言,认为我手写字符串拼接效率过低,容易出错.在经过一段时间的摸索和学习之后,发现现在拼接字符串的方法都不在是自己去书写了,而是使用Javasc ...

  2. artTemplate模板引擎

    artTemplate模板引擎         <li>索引 {{i + 1}} :{{value}}</li>     {{/each}} </ul> </ ...

  3. 高性能前端 art-template 模板

    官网: https://aui.github.io/art-template/zh-cn/index.html nodejs 服务器端使用 第一步: 引入 art-template 的包 npm in ...

  4. django的小操作,查询效率up, 引用art-template模板+djangorestframework

    Part1: 提高查询效率newses = News.objects.select_related('category', 'author').get(id=1) # category和author字 ...

  5. thinkjs——art-template模板用法

    前言: 概述之前先附上此正式版介绍地址:https://github.com/aui/artTemplate  or http://www.jq22.com/jquery-info1097,可以再看下 ...

  6. ajax请求数据填充表格———使用art-template模板提高效率

    一.为什么要用art-template模板 在实习的一次项目中,因为需求中展示表格的字段有很多个,后端返回的也是json数据,这时候如果还是使用之前的字符串拼接,这样会开发得比较慢,而且容易出错,而且 ...

  7. nodejs中引入art-template模板

    使用Webstorm创建nodejs express应用时,默认使用的是jade或者ejs模板,对于不习惯这两种模板语法的人来说确实不是很方便.没关系,这里我们使用art-template模板引擎,使 ...

  8. koa art-template模板引擎的使用

    art-template 模板引擎介绍 art-template 是一个简约.超快的模板引擎. 它采用作用域预声明的技术来优化模板渲染速度,从而获得接近 JavaScript 极限的运行 性能,并且同 ...

  9. Node学习之(第三章:art-template模板引擎的使用)

    前言 大家之前都有使用过浏览器中js模板引擎,其实在Node.js中也可以使用模板引擎,最早使用模板引擎的概念是在服务端新起的. art-template art-template是一款高性能的Jav ...

随机推荐

  1. 读取SD卡中的图片

    Touxiang=(ImageView)view.findViewById(R.id.Touxiang); //头像Bitmap bm = BitmapFactory.decodeFile(" ...

  2. 基于HTML5 Canvas生成粒子效果的人物头像

    前面我们分享过一个HTML5 Canvas实现的图像马赛克模糊效果,HTML5处理图片真的非常简单.今天我们要再利用HTML5 Canvas实现一个粒子效果的人物头像,你可以任意选择一张头像图片,接下 ...

  3. HTTP Header Accept-Language的ctf

    题目也不知道该怎么取,但是是实在的一个案例.分享给大家. 种族歧视分值: 300 小明同学今天访问了一个网站,竟然不允许中国人访问!太坑了,于是小明同学决心一定要进去一探究竟!  发现accept-L ...

  4. 高德地图sdk的AMapNavi.getInstance为null解决办法

    问题,动态库没有全部导入,之前我只放到了armeabi下,可是没想到我手机是armeabi-v7a的. 最近做Android项目,先用的是百度地图,可是后来发现百度地图没有提供地图的View点击事件( ...

  5. ssh配置authorized_keys后仍然需要输入密码的问题

    前阵子搭建Hadoop时,配置了本机(localhost)的ssh的公钥到authorized_keys文件中,但是在ssh连接localhost时仍然提示需要输入密码,后来发现是$HOME/.ssh ...

  6. Thinkphp整合各个功能

    thinkphp整合Auth权限管理.支付宝.微信支付.阿里oss.友盟推送.融云即时通讯.云通讯短信.Email.Excel.PDF等等: 基于thinkphp扩展了大量的功能:而不改动thinkp ...

  7. (转)c++ new/delete,new[]/delete[]原理解析

    转自: 推荐:http://www.cnblogs.com/hazir/p/new_and_delete.html http://blog.csdn.net/crazyboyzzx/article/d ...

  8. C++之异常处理

     C++ Code  12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849 ...

  9. 数据仓库与BI面试常见题目

    一. 数据库 1. Oracle数据库,视图与表的区别?普通视图与物化视图的区别?物化视图的作用?materialized view 答:a:视图是虚拟表,提高了表的安全性,视图没有实际物理空间,而表 ...

  10. string类(四、字符串比较相关)

    string类比较相关: 1. string.Compare [static] 1/ string.Compare(string A, string B); 比较两个string,返回整数表示二者在排 ...