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>
    
模板逻辑语法开始与结束的界定符号为&lt;% 与%&gt;,若&lt;%后面紧跟=号则输出变量内容。

渲染模板

template.render(id, data)
    
    var data = {
        title: '标签',
        list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
    };
    var html = template.render('test', data);
    document.getElementById('content').innerHTML = html;

artTemplate 介绍的更多相关文章

  1. lodop+art-template实现web端漂亮的小票样式打印

    一. 现状 由于之前采用Lodop打印控件(商业版付费,可以使用免费版 但是会有水印)去打印小票,是一行一行的打印,但是不满足UI给到复杂布局的小票样式,所以得重新考虑如何来实现. 二. 介绍 art ...

  2. template.js的介绍

    artTemplate 介绍 artTemplate 是新一代 javascript 模板引擎,它采用预编译方式让性能有了质的飞跃,并且充分利用 javascript 引擎特性,使得其性能无论在前端还 ...

  3. 高性能JavaScript模板引擎原理解析

    随着 web 发展,前端应用变得越来越复杂,基于后端的 javascript(Node.js) 也开始崭露头角,此时 javascript 被寄予了更大的期望,与此同时 javascript MVC ...

  4. artemplate模板

    artTemplate 介绍 最近使用了一款模板,学习成本比较低,性能也不错.觉得很好用,所以推荐给大家. artTemplate 是新一代 javascript 模板引擎,它采用预编译方式让性能有了 ...

  5. 高性能JavaScript模板引擎实现原理详解

    这篇文章主要介绍了JavaScript模板引擎实现原理详解,本文着重讲解artTemplate模板的实现原理,它采用预编译方式让性能有了质的飞跃,是其它知名模板引擎的25.32 倍,需要的朋友可以参考 ...

  6. 后台模板引擎ejs与前台模板引擎artTemplate的简单介绍

    动态网页是指前端页面当中的数据内容来源于后台数据库,前端的html代码会随着后台数据的变化而变化,是动态生成的.制作动态网页有两种方式,一种方式是在后台拿到前端的html模板,利用后台模板引擎(如ej ...

  7. JS 模板引擎 BaiduTemplate 和 ArtTemplate 对比及应用

    最近做项目用了JS模板引擎渲染HTML,JS模板引擎是在去年做项目是了解到的,但一直没有用,只停留在了解层面,直到这次做项目才用到,JS模板引擎用了两个 BaiduTemplate 和 ArtTemp ...

  8. artTemplate模板引擎学习实战

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

  9. artTemplate 自动化编译之tmod

    一.背景 前端小白的成长历程,一般都会经历html模板的一些问题,jquery template/artTemplate/yayaTemplate等常见的模板使用,这里就不作介绍了. 先谈谈我们为什么 ...

随机推荐

  1. mssql表名列名对应语句

    if exists (select * from tempdb..sysobjects where name like '#magic%') drop table #magic go select a ...

  2. 用Razor語法寫範本-RazorEngine組件介紹【转——非常好,可以用它来代替NVelocity】

    RazorEngine 官網網址:http://razorengine.codeplex.com 在找到RazorEngine之前曾經想過其他的方案,如T4與V8 Engine載jquery.temp ...

  3. [Linux] zip 与 unzip 命令

    zip zip 命令基本格式为: zip options archive inpath inpath ... archive 是 .zip 文件(新的或已经存在的). inpath 是需要打包的目录或 ...

  4. python之网络爬虫

    一.演绎自已的北爱 踏上北漂的航班,开始演奏了我自已的北京爱情故事 二.爬虫1 1.网络爬虫的思路 首先:指定一个url,然后打开这个url地址,读其中的内容. 其次:从读取的内容中过滤关键字:这一步 ...

  5. ruby -- 基础学习(九)filename去除扩展名

         Rails -- filename去除扩展名 简单例子:params[:upload]['preview'].original_filename 的值为templateOne.html.er ...

  6. Python单元测试框架之pytest -- 断言

    对于测试来讲,不管是功能测试,自动化测试,还是单元测试.一般都会预设一个正确的预期结果,而在测试执行的过程中会得到一个实际的结果.测试的成功与否就是拿实际的结果与预期的结果进行比较.这个比的过程实际就 ...

  7. Sylius – 100% 免费和开源的电子商务解决方案

    Sylius 项目提供了一个完整的电子商务解决方案.您将学习如何掌握它,帮助你在下一个项目中能够更快速的开发.Sylius 提供了一个完整的在线商店演示:demo.sylius.com. 您可能感兴趣 ...

  8. EventBus初理解

    缘由:     平时工作,因为懒于动笔的原因,也没注重技术和经验的积累,导致之前曾经研究过的问题现在又忘记了,所以要慢慢注重积累,那么就从写作开始,谈谈对工作中碰到的问题进行整理和归纳.     我们 ...

  9. #敏捷个人资料# 免费下载 《敏捷个人-认识自我,管理自我 v0.8.pdf》

    快乐.高效.平衡,做一个爱学习.有目标.懂生活的影响者. 从今天开始至7月31日,点击http://t.cn/Rv3koHU 免费收到 1000多页的 <敏捷个人-认识自我,管理自我 v0.8. ...

  10. 内存中OLTP(Hekaton)的排序警告

    内存中OLTP是关于内存中的一切.但那只是对了一半.在今天的文章里我想给你展示下,当你从内存读取数据时,即使内存中OLTP也会引起磁盘活动.这里的问题是执行计划里,不正确的统计信息与排序(sort)运 ...