模板插件aTpl.js新增功能

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

摘要:

  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;
    });

 

相关文章
|
9天前
|
JavaScript 前端开发
JavaScript分页功能
JavaScript分页功能
|
23小时前
|
JavaScript 前端开发 API
|
23小时前
|
JavaScript API UED
vue.js怎么实现全屏显示功能
【10月更文挑战第7天】
3 1
|
7天前
|
资源调度 JavaScript UED
如何使用Vue.js实现单页应用的路由功能
【10月更文挑战第1天】如何使用Vue.js实现单页应用的路由功能
|
6天前
|
JavaScript 搜索推荐
JS中的模糊查询功能
JS中的模糊查询功能
14 1
|
6天前
|
JavaScript 安全 前端开发
js实现复制功能
js实现复制功能
9 0
|
18天前
用html+javascript打造公文一键排版系统14:为半角和全角字符相互转换功能增加英文字母、阿拉伯数字、标点符号、空格选项
用html+javascript打造公文一键排版系统14:为半角和全角字符相互转换功能增加英文字母、阿拉伯数字、标点符号、空格选项
|
存储 前端开发 JavaScript
|
存储 JavaScript 前端开发
JavaScript 常用功能总结
小编吐血整理加上翻译,太辛苦了~求赞! 本文主要总结了JavaScript 常用功能总结,如一些常用的JS 对象,基本数据结构,功能函数等,还有一些常用的设计模式。   目录: 众所周知,JavaScript是动态的面向对象的编程语言,能够实现以下效果: 1. 丰富Web 网页功能 2. 丰富Web界面 3. 实现本地或远程存储。
1248 0
|
3月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
81 2