artTemplate 介绍
artTemplate 是新一代 javascript 模板引擎,它采用预编译方式让性能有了质的飞跃,并且充分利用 javascript 引擎特性,使得其性能无论在前端还是后端都有极其出色的表现。
编写模板
使用一个type="text/html"
的script
标签存放模板:
<script id="test" type="text/html">
<h1><%=title%></h1>
<ul>
<%for(i = 0; i < list.length; i ++) {%>
<li>条目内容 <%=i + 1%> :<%=list[i]%></li>
<%}%>
</ul>
</script>
模板逻辑语法开始与结束的界定符号为<%
与%>
,若<%
后面紧跟=
号则输出变量内容。
渲染模板
template.render(id, data)
var data = {
title: '标签',
list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
};
var html = template.render('test', data);
document.getElementById('content').innerHTML = html;
artTemplate 介绍的更多相关文章
- lodop+art-template实现web端漂亮的小票样式打印
一. 现状 由于之前采用Lodop打印控件(商业版付费,可以使用免费版 但是会有水印)去打印小票,是一行一行的打印,但是不满足UI给到复杂布局的小票样式,所以得重新考虑如何来实现. 二. 介绍 art ...
- template.js的介绍
artTemplate 介绍 artTemplate 是新一代 javascript 模板引擎,它采用预编译方式让性能有了质的飞跃,并且充分利用 javascript 引擎特性,使得其性能无论在前端还 ...
- 高性能JavaScript模板引擎原理解析
随着 web 发展,前端应用变得越来越复杂,基于后端的 javascript(Node.js) 也开始崭露头角,此时 javascript 被寄予了更大的期望,与此同时 javascript MVC ...
- artemplate模板
artTemplate 介绍 最近使用了一款模板,学习成本比较低,性能也不错.觉得很好用,所以推荐给大家. artTemplate 是新一代 javascript 模板引擎,它采用预编译方式让性能有了 ...
- 高性能JavaScript模板引擎实现原理详解
这篇文章主要介绍了JavaScript模板引擎实现原理详解,本文着重讲解artTemplate模板的实现原理,它采用预编译方式让性能有了质的飞跃,是其它知名模板引擎的25.32 倍,需要的朋友可以参考 ...
- 后台模板引擎ejs与前台模板引擎artTemplate的简单介绍
动态网页是指前端页面当中的数据内容来源于后台数据库,前端的html代码会随着后台数据的变化而变化,是动态生成的.制作动态网页有两种方式,一种方式是在后台拿到前端的html模板,利用后台模板引擎(如ej ...
- JS 模板引擎 BaiduTemplate 和 ArtTemplate 对比及应用
最近做项目用了JS模板引擎渲染HTML,JS模板引擎是在去年做项目是了解到的,但一直没有用,只停留在了解层面,直到这次做项目才用到,JS模板引擎用了两个 BaiduTemplate 和 ArtTemp ...
- artTemplate模板引擎学习实战
在我的一篇关于智能搜索框异步加载数据的文章中,有博友给我留言,认为我手写字符串拼接效率过低,容易出错.在经过一段时间的摸索和学习之后,发现现在拼接字符串的方法都不在是自己去书写了,而是使用Javasc ...
- artTemplate 自动化编译之tmod
一.背景 前端小白的成长历程,一般都会经历html模板的一些问题,jquery template/artTemplate/yayaTemplate等常见的模板使用,这里就不作介绍了. 先谈谈我们为什么 ...
随机推荐
- QQ微信的备份
一.问题的提出 windows phone上的微信,累积了太多的微信消息,突然提示“数据库占用空间过大,请及时清理” 二.问题的分析 在朋友发起的群聊中,大量的图片.视频,打开后是下载到本机上的,下载 ...
- [原]Android Native Debug
1,安装adt插件,cdt插件2,SDK目录配置: Eclipse文件菜单选择“Window”--->“Preferences”--->“Android”--->设置“SDK Loc ...
- 自定义ISPF面板
1)登录的时候可以看到登录执行的PROCEDURE,此处为DBSPROC 2.登录后,进入SDSF,再进入LOG,输入命令TOP,再输入命令F JOB,按F11把屏幕向右翻页,看到哪下界面 找到//I ...
- WCF配置工具及服务调试工具
配置工具 C:\Program Files\Microsoft SDKs\Windows\v7.0A\bin\SvcConfigEditor.exe WCF调试客户端工具 C:\Program F ...
- JS基础回顾,小练习(判断数组,以及函数)
追梦子博客版权所有. // 判断arr是否为一个数组,返回一个bool值 方法1: function isArray(arr) { var str = arr.__proto__.constructo ...
- c++中基类与派生类中隐含的this指针的分析
先不要看结果,看一下你是否真正了解了this指针? #include<iostream> using namespace std; class Parent{ public: int x; ...
- Android 布局之LinearLayout
Android 布局之LinearLayout 1 LinearLayout简介 LinearLayout是线程布局.它包括2个方向(android:orientation):“水平”(horizon ...
- [OpenCV] Feature Extraction
特征检测 特征描述 特征匹配 特征跟踪 “不读白不读,读了还想读” 的一本基础书 低层次特征提取 阈值方法 1. 边缘检测 一阶检测算子 二阶检测算子 相位一致性(频域) 2. 角点检测(局部特征提取 ...
- [转载]SharePoint 2013测试环境安装配置指南
软件版本 Windows Server 2012 标准版 SQL Server 2012 标准版 SharePoint Server 2013 企业版 Office Web Apps 2013 备注: ...
- DalekJS – 基于 JavaScript 实现跨浏览器的自动化测试
在 Web 项目中,浏览器兼容以及跨浏览器测试是最重要的也是最费劲的工作.DalekJS 是一个基于 JavaScript(或 Node.js) 的免费和开源的自动化测试接口.它能够同时运行测试一组流 ...