template.js模板引擎

 查看演示  website  立即下载

template.js

template.js 一款javascript模板引擎，简单，好用。

功能概述

提供一套模板语法，用户可以写一个模板区块，每次根据传入的数据，生成对应数据产生的HTML片段，渲染不同的效果。

特性

• 模版编译，渲染

• 支持所有主流浏览器及Node（UMD）

• JavaScript原生语法

• 丰富的自定义配置

• 支持数据过滤

• 异常捕获功能

• 功能专一，简单好用

兼容性

• Node 0.10+

• Safari 6+ (Mac)

• iOS 5+ Safari

• Chrome 23+ (Windows, Mac, Android, iOS, Linux, Chrome OS)

• Firefox 4+ (Windows, Mac, Android, Linux, Firefox OS)

• Internet Explorer 6+ (Windows, Windows Phone)

• Opera 10+ (Windows, linux, Android)

如何使用

传统用法

<script src="template.js"></script>

AMD

require(['template'], function (template) {
    ***
});

Bower

$ bower install template.js
$ bower install git://github.com/yanhaijing/template.js.git

spm

$ spm install template.js

npm

$ npm install template_js
$ npm install yanhaijing/template.js

快速上手

编写模版

使用一个type="text/html"的script标签存放模板，或者放到字符串中：

<script id="tpl" type="text/html">
    <ul>
        <%for(var i = 0; i < list.length; i++) {%>
            <li><%:=list[i].name%></li>
        <%}%>
    </ul>
</script>

渲染模板

var tpl = document.getElementById('tpl').innerHTML;
template(tpl, {list: [{name: "yan"},{name: "haijing"}]});

输出结果：

<ul>
<li>yan</li>
<li>haijing</li>
</ul>

更多例子，请见demo目录。

PREVIOUS:
NEXT:
jQuery html5背景视频插件vidbacking
jQuery时间日期插件