tpl.js(大家直接去https://git.oschina.net/tianqiq/tpl.js这个上面看)

简介

tpl.js是一个比较极致(极小,极快,极简单)的js模板引擎,可以在各种js环境中使用。

特性

1. 使用js作为模板语言,几乎无学习成本
2. 小巧,速度快到极致
3. 极简的语法,模板书写非常流畅
4. mit开源,无限制

语法说明

简述

tpl.js中模板语法中以行为单一,分为js行语句,和输出行语句。顾名思义,js行语句是编译时候会当做js执行的语句,

而输出行语句,则是会输出为html。

具体语法

1. 以行为单位,每一行作为语句块,并去掉行前后空白字符
2. 如果行不是以<(左尖括号)开头,则视为js,如果不是,则视为该行为输出行
3. 如果行以!(叹号)开头,也视该行为输出行。如 !aa
4. 在输出行中通过@{exp}这样的表达式作为js变量输出。@{item.name}
5. 如果exp以.(点)开头,则自动解析为上个exp表达式中最后一个点的前面部分。如@{.name},将自动解析为@{item.name}
6. 如果4中exp无特殊字符,如"、'、'<、 >等。则可以省略{}中括号。如@.item.name @.name @func(item) @list[i]
7. 如果行以!!2个叹号开头,则视该行为纯输出行,不解析@表达式,原样输出。如!!abc@def
8. 如果行中出现@又不想要tpl.js解析,则通过\转义。如\@abc

示例

API

  • tpl.html(tplText,daata)

    通过传递tplText模板,和数据data直接获取模板生成的html代码。

  • tpl.func(tplText)

    将tplText编译为一个函数,该函数参数在模板中通过tplData引用。 调用后返回模板编译后的html代码。

  • tpl.render()

    自动渲染整个网页中的<script type="tpl">标签中的模板。并能保证html dom中原有的结构。相当于替换掉了原来的<script type="tpl">标签

最后

上面的文档包括了tpl.js所有的语法了,欢迎大家测试与反馈。

源码地址:https://git.oschina.net/tianqiq/tpl.js

测试地址:http://runjs.cn/code/wlztch4d

真的无语,上面文档里面```html


折腾半天,也不知道怎么搞。大家直接去https://git.oschina.net/tianqiq/tpl.js这个上面看吧。哎...

发布一个开源极致的javascript模板引擎tpl.js的更多相关文章

  1. Javascript模板引擎mustache.js详解

    mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后只有9KB,非常值得在项目中使用.本文总结它的使用方法和一些使用心得,内容不算很高深 ...

  2. JavaScript模板引擎Template.js使用详解

    这篇文章主要为大家详细介绍了JavaScript模板引擎Template.js使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下   template.js 一款 JavaScript 模板引 ...

  3. 探究Javascript模板引擎mustache.js使用方法

    这篇文章主要为大家介绍了Javascript模板引擎mustache.js使用方法,mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后 ...

  4. JavaScript模板引擎artTemplate.js——为什么使用模板引擎?

    作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...

  5. JavaScript模板引擎artTemplate.js——如何引入模板引擎?

    artTeamplate.js在github上的地址:artTemplate性能卓越的js模板引擎 引入模板引擎,就是引入外部javascript啦,并且artTemplate.js不依赖其他第三方库 ...

  6. JavaScript模板引擎artTemplate.js——结语

    再次首先感谢模板的作者大神,再次放出github的地址:artTemplate性能卓越的js模板引擎 然后感谢博客园的一位前辈,他写的handlebars.js模板引擎教程,对我提供了很大的帮助,也是 ...

  7. javascript模板引擎template.js使用

    到GitHub上下载template.js库.引入到页面 以type="text/html" 这样指定javascript类型的是一种javascript模板渲染方法,在实际项目中 ...

  8. JavaScript模板引擎artTemplate.js——template.compile()方法

    template.compile(source, options) source:必传,渲染模板的内容. options:可选,通常不传.(其实是我还没研究明白) return:一个渲染函数. 示例如 ...

  9. JavaScript模板引擎artTemplate.js——template()方法

    template(id, data)方法: id:必传,渲染模板的id. data:可选,一个Object对象. return:传data—>渲染完成html代码:不传data—>一个渲染 ...

随机推荐

  1. jquery+ajax实现分页

    var curPage = 1; //当前页码 var total,pageSize,totalPage; //总记录数,每页显示数,总页数 getData(1); $("#pagecoun ...

  2. sqlserver日志管理(转载)

    sql 在使用中每次查询都会生成日志,但是如果你长久不去清理,可能整个硬都堆满哦,笔者就遇到这样的情况,直接网站后台都进不去了.下面我们一起来学习一下如何清理这个日志吧     SQL2005清空删除 ...

  3. linux 配置 ftp

    1.检测是否安装ftp 2.apt-get install 安装 (如果安装失败 执行apt-get install update<如果update失败 配置dns让自己的服务器 可以ping ...

  4. 小米抢购(简单版v0.1)-登录并验证抢购权限,以及获取真实抢购地址

    小米(简单版)-登录并验证抢购权限,以及获取真实抢购地址! 并不是复制到浏览器就行了的   还得传递所需要的参数 这里只是前部分  后面的自己发挥了 { "stime": 1389 ...

  5. 07_编写天气预报和手机归属地的WebService

    <s:element ref="s:schema" /> <s:any /> <s:any minOccurs="2" maxOc ...

  6. 【原创】如何用Android Studio断点安卓自带Service或Bind类型的Service

    很久以来,我一直想找一种方法来断点调试安卓系统自身的Service,或者bind类型的Service,比如我想看WifiManager里面的getWifiApConfiguration函数是如何实现的 ...

  7. Entity Framework7 有哪些不同?之具体功能

    Entity Framework7 有哪些不同?之具体功能 前面我们介绍了关于EF7的新特性.开发计划和入门介绍.今天,我们来看看EF7的具体新功能及用法.本文中的环境,为EF7入门里介绍的环境. 1 ...

  8. Mysql中的少用函数

    1.查询时需要转换类型,大多发生在数字和字符串.时间和字符串之间 Mysql提供了两个个类型转换函数:CAST和CONVERT CAST() 和CONVERT() 函数可用来获取一个类型的值,并产生另 ...

  9. angular中不同controller传值问题

    利用angularJS中service单例模式的特性,服务(service)提供了一种能在应用的整个生命周期内保持数据的方式,能够在控制器之间进行通信,且能保证数据的一致性. 一般我们都会封装serv ...

  10. Angular--页面间切换及传值的四种方法

    1. 基于ui-router的页面跳转传参(1) 在AngularJS的app.js中用ui-router定义路由,比如现在有两个页面,一个页面(producers.html)放置了多个produce ...