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. 为什么Pojo类没有注解也没有spring中配置<bean>也能够被加载到容器中。

    Spring的注入机制其实就是代替了new的这个过程(称为解耦). 写了一个Thread类,没有加注解@Component,但是可以正常运行,开始为了自圆其说,打通逻辑,猜测是StartThread中 ...

  2. Activityn 生命周期

    前言 Activity 生命周期,虽然开发android 程序有几年了,但是很多基本东西还是经常遗忘模糊,在此笔记白纸黑字记录,下次记忆模糊的时候温故知新.网上一搜索一大把,但是多是一大堆各种日志搅来 ...

  3. 浅谈大型web系统架构

    动态应用,是相对于网站静态内容而言,是指以c/c++.php.Java.perl..net等服务器端语言开发的网络应用软件,比如论坛.网络相册.交友.BLOG等常见应用.动态应用系统通常与数据库系统. ...

  4. HDU5870 Alice's Adventure in Wonderland

    大概做法是这样的 考虑最朴素的做法,预处理出1到所有点的最短路数组dis1和方案数数组cnt1,和预处理出n到所有点的最短路数组dis2和方案数数组出cnt2,然后暴力枚举点对(A,B),如果A和B之 ...

  5. 配置java环境 ,安装Android Studio...(ps:用eclipse也不错,但as是趋势 自己凭爱好选择)

    to:青科大可爱的学弟学妹: 配置java环境 step1:下jdk 直接打开链接即可(ps:复制链接到迅雷下载更快哦) 64位的:http://download.oracle.com/otn-pub ...

  6. 导出Excel And 导出word

      <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default6.aspx. ...

  7. Mysql 数据库中所有列名为某个值的 sql 语句

    SELECT DISTINCT TABLE_NAME FROM INFORMATION_SCHEMA.COLUMNS WHERE COLUMN_NAME IN ('columnname') AND T ...

  8. jq 弹半透明遮罩层

    jquery制作点击按钮弹出遮罩半透明登陆窗口 // )[^>]*$|^#([\w-]+)$/,M=/^.[^:#\[\.,]*$/,ka=/\S/,$= /^(\s|\u00A0)+|(\s| ...

  9. 安装freetds小记

    FreeTDS的软件获取:在官网上进行下载:http://www.freetds.org/ 执行以下命令: ./configure --with-tdsver=7.1 --enable-msdblib ...

  10. CentOS配置本地光盘yum源

    在实际使用linux的过程中,会经常出现安装的发行版有的软件包没有安装的情况,这时,就需要用户从如下两种操作中做出选择:1.手动安装rpm包.2.用yum命令安装软件包. 选择1手动安装的时候经常会遇 ...