artTemplate模板使用补充
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模板使用补充的更多相关文章
- artTemplate模板引擎学习实战
在我的一篇关于智能搜索框异步加载数据的文章中,有博友给我留言,认为我手写字符串拼接效率过低,容易出错.在经过一段时间的摸索和学习之后,发现现在拼接字符串的方法都不在是自己去书写了,而是使用Javasc ...
- artTemplate模板引擎
artTemplate模板引擎 <li>索引 {{i + 1}} :{{value}}</li> {{/each}} </ul> </ ...
- 高性能前端 art-template 模板
官网: https://aui.github.io/art-template/zh-cn/index.html nodejs 服务器端使用 第一步: 引入 art-template 的包 npm in ...
- django的小操作,查询效率up, 引用art-template模板+djangorestframework
Part1: 提高查询效率newses = News.objects.select_related('category', 'author').get(id=1) # category和author字 ...
- thinkjs——art-template模板用法
前言: 概述之前先附上此正式版介绍地址:https://github.com/aui/artTemplate or http://www.jq22.com/jquery-info1097,可以再看下 ...
- ajax请求数据填充表格———使用art-template模板提高效率
一.为什么要用art-template模板 在实习的一次项目中,因为需求中展示表格的字段有很多个,后端返回的也是json数据,这时候如果还是使用之前的字符串拼接,这样会开发得比较慢,而且容易出错,而且 ...
- nodejs中引入art-template模板
使用Webstorm创建nodejs express应用时,默认使用的是jade或者ejs模板,对于不习惯这两种模板语法的人来说确实不是很方便.没关系,这里我们使用art-template模板引擎,使 ...
- koa art-template模板引擎的使用
art-template 模板引擎介绍 art-template 是一个简约.超快的模板引擎. 它采用作用域预声明的技术来优化模板渲染速度,从而获得接近 JavaScript 极限的运行 性能,并且同 ...
- Node学习之(第三章:art-template模板引擎的使用)
前言 大家之前都有使用过浏览器中js模板引擎,其实在Node.js中也可以使用模板引擎,最早使用模板引擎的概念是在服务端新起的. art-template art-template是一款高性能的Jav ...
随机推荐
- MongoDB随笔
创建用户 db.createUser({user: "abc",pwd: "abc123",roles: [ { role: "readWrite&q ...
- JS 数组以及对象的深拷贝总结
javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法 前言 在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝.如下图演示: 如上,arr的修改,会影响arr2的值,这 ...
- css样式整理
字体属性:(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 {font-style: obl ...
- asp.net 判断session是否过期
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We ...
- Android性能测试框架Emmagee
目前移动设备,尤其是Android设备,相对于过去的J2me时代,硬件有大幅度的提高,并且更新地非常快,可以安装和运行更多的应用. 但是目前安卓市场对于应用的要求并不如苹果商店那么严格,Android ...
- TensorFlow基础笔记(2) minist分类学习
(1) 最简单的神经网络分类器 # encoding: UTF-8 import tensorflow as tf from tensorflow.examples.tutorials.mnist i ...
- 输出JS代码中的变量内容
一. 输出JS代码中的变量内容 1. 可以直接以提示框的形式输出 alert("输出的内容"); 2. 可以输出到网页的某个位置 a. 在显示输出的位置放一个标签 <a id ...
- 在J2EE中属于Web层的组件有(选择1项)
在J2EE中属于Web层的组件有(选择1项) A. HTML B. EJB C. Applet D. JSP 解答:D
- 在Swing的组件中,基本上都是在AWT组件的名称前面加“J”
在Swing的组件中,基本上都是在AWT组件的名称前面加“J”. 一般情况下,除了Choise等组件: import javax.swing.*;好要加上:import java.awt.*以及imp ...
- TrustZone——开源库—Linaro—OP-TEE
想研究安全系统源代码的有福气了.曾经OVOS的代码缺少TA相关的实现. 这次的版本号,基本框架都有了.先看看架构图吧. 几家大公司做的,可能是ST牵头.页面有ST的LOGO. 代码质量较高. 未来也会 ...