template模板

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)

编写模版

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

?

1

2

3

4

5

6

7

<script id="tpl" type="text/html">

<ul>

    <%for(var i = 0; i < list.length; i++) {%>

    <li><%:=list[i].name%></li>

    <%}%>

</ul>

</script>

渲染模板

?

1

2

var tpl = document.getElementById('tpl').innerHTML;

template(tpl, {list: [{name: "yan"},{name: "haijing"}]});

输出结果：

?

1

2

3

4

<ul>

    <li>yan</li>

    <li>haijing</li>

</ul>