# artTemplate.js 模板引擎 简洁语法例子

语法

• 首先同样是引入template.js

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

• 在结构中随便创建个div

<div id="div1"></div>

• 创建模板(简洁的语法)

<script id="content" type="text/html">
    {{if isAdmin}}
        <h1>{{title}}</h1>
        <ul>
            {{each list as value index}}
               <li>索引：{{index}}:{{value}}</li>
            {{/each}}
        </ul>
    {{/if}}
</script>

• 创建模板（原生语法）

<%if (isAdmin) {%>
    <h1><%=title%></h1>
    <ul>
        <%for (var i = 0; i < list.length; i++) {%>
            <li>索引：<%i%>:<%list[i]%></li>
        <%}%>
    </ul>
<%}%>
* 数据 （数据一般是从后台获取）

<script>
var data = {
title: "hello world",
isAdmin: true,
list: ['新闻','军事','历史','政治']
}；
var html = template('content',data);
document.getElementById('div1').innerHTML = html;
</script>

> 注意：简洁语法引用的js为（template.js）,原生语法引用的js为（template-native.js）

参考网址：https://github.com/aui/artTemplate