摘要:

  aTpl.js是一款模板插件,该插件支持ie5+,chrome等浏览器以及移动端浏览器,支持for和if语法,以及表达式。最近对aTpl.js模板插件增加了新的功能,支持字符串模板,同时增加了模板缓存功能。

项目地址:https://github.com/baixuexiyang/aTpl

性能测试:http://baixuexiyang.github.io/aTpl/doc/perform.html

实例:

var data = {
name: '测试',
sex: 1,
contact: [{
name: '张三',
sex: 1
}, {
name: '李四',
sex: 2
}]
};
var temp = "{{@ for(var i = 0, _l = aTpl.contact.length; i < _l; i++){ }}\
{{@ if(aTpl.contact[i].name==='张三' ) { }}\
<li>\
<span>姓名:{{ aTpl.contact[i].name + '条件输出' }}</span>\
<span>性别:{{ aTpl.contact[i].sex===1 ? '男': '女' }}</span>\
</li>\
{{@ } else { }}\
<li>\
<span>姓名:{{ aTpl.contact[i].name }}</span>\
<span>城市:{{ aTpl.contact[i].sex===1 ? '男': '女' }}</span>\
</li>\
{{@ } }} {{@ } }}";
aTpl.template(temp).render(data, function(html) {
document.getElementById('demo').innerHTML = html;
});

模板插件aTpl.js新增功能的更多相关文章

  1. javascript模板插件amaze.js

    摘要: 最近在开发项目时,异步接口需要前端渲染数据,js拼接太低级,必然要用模板插件.之前用过基于jQuery的和juicer等插件,考虑到以后公司项目上的统一,移动端和pc端上的统一,以及可维护性, ...

  2. 模板插件aTpl

    摘要: 前面给大家分享了一款js模板插件,后来经过完善推荐给大家.该插件支持ie5+,chrome等浏览器以及移动端浏览器,支持for和if语法,以及表达式. 项目地址:https://github. ...

  3. jquery.pagination.js 新增 首页 尾页 功能

    jquery.pagination.js 新增 首页 尾页 功能 废话不多说,直接上修改后的代码,修改部分已经用 update 注释包含 17-20行 99-103行 141-145行 /** * T ...

  4. cloudstack4.4新增功能前瞻

    cloudstack4.4.0新功能前瞻 转载请注明地址:http://blog.csdn.net/zt689/article/details/37698989 1.   cloudstack4.4. ...

  5. select 自定义样式插件 selectize.js

    [特别推荐]几款极好的 JavaScript 下拉列表插件   表单元素让人爱恨交加.作为网页最重要的组成部分,表单几乎无处不在,从简单的邮件订阅.登陆注册到复杂的需要多页填写的信息提交功能,表单都让 ...

  6. .NET Framework3.0/3.5/4.0/4.5新增功能摘要

    Microsoft .NET Framework 3.0 .NET Framework 3.0 中增加了不少新功能,例如: Windows Workflow Foundation (WF) Windo ...

  7. hadoop2.6.0汇总:新增功能最新编译 32位、64位安装、源码包、API下载及部署文档

    相关内容: hadoop2.5.2汇总:新增功能最新编译 32位.64位安装.源码包.API.eclipse插件下载Hadoop2.5 Eclipse插件制作.连接集群视频.及hadoop-eclip ...

  8. 移动端下拉刷新、加载更多插件dropload.js(基于jQuery/Zepto)

    移动端下拉刷新.加载更多插件dropload.js(基于jQuery/Zepto) 原文:http://www.grycheng.com/?p=1869 废话不多说,先让大家看一下案例效果: DEMO ...

  9. 模板引擎mustache.js

    Javascript模板引擎mustache.js详解   阅读目录 1. 从一个简单真实的需求讲起 2. mustache的用法 3. mustache的思想 4. {{prop}}标签 5. {{ ...

随机推荐

  1. ANSI,UTF8等等这些格式

    之前一直在纠结这些格式到底有什么区别,有时候因为格式的问题会让人抓狂. 下面通过实战来分析下: 下面在windows上建立一个txt文档.txt的优势是没有文件头,这样比较好分析. ANSI格式: 可 ...

  2. 关于delete 和 new

    关于new和delete,有如下代码 // new_test.cpp #include<iostream> using namespace std; class A { public: A ...

  3. XP明年就被停止技术支持,这会带来什么?谈谈如何做决策

    XP是MS的一款老牌操作系统,相信大家都不陌生,甚至还有继续使用的人,当然了,在虚拟机里用它也是很好用的,不过,再漂亮的姑娘,也有嫁人的时候,作为XP的父母,MS微软明年四月将停止支持有十多年历史的 ...

  4. webstorm调试Node的时候配置

    点击Edit Configurations的这个的配置:(不能点击是因为目前你选中的不是项目)

  5. oracle 分区表

    分区表用途 分区表通过对分区列的判断,把分区列不同的记录,放到不同的分区中.分区完全对应用透明.Oracle的分区表可以包括多个分区,每个分区都是一个独立的段(SEGMENT),可以存放到不同的表空间 ...

  6. JQuery学习(1)

    JQuery学前准备 JQuery的各种包: 1.jquery-ui(包含小工具及组件) 2.jquery-1.7.1.intellisense.js(智能提示包) 3.jquery-1.7.1.js ...

  7. 小结-Splay

    参照陈竞潇学长的模板写的BZOJ 3188: #include<cstdio> #include<cstring> #include<algorithm> #def ...

  8. Java基础-多线程

    介绍 操作系统能同时运行几个程序,每个独立运行的程序又称之为进程. 对于同一个程序,它又可以分成若干个独立的执行流,我们称之为线程.线程提供了多任务处理的能力 用进程和线程的观点来研究软件是当今普遍采 ...

  9. yii2URL美化

    yii2的url 域名/index.php?r=site%2Findex 实际为 域名/index.php?r=site/index 可以美化下 可以在main.php中配置 'components' ...

  10. 理解SIFT

    理解SIFT.tab{font-size:12px; margin-bottom: 10px;}.tab a{cursor:pointer;cursor:pointer;display:inline- ...