art-template

javascript 模板引擎，官网：

分为原生语法和简洁语法，本文主要是讲简洁语法

• 基础数据渲染
• 输出HTML
• 流程控制
• 遍历
• 调用自定义函数方法
• 子模板引入

基础数据渲染

一、引入art-template.js文件

二、编写HTML模板

三、向模板插入数据，并输出到页面

var data = {    title:"hello world"};var html = template("test",data);document.getElementById('content').innerHTML = html;

输出HTML

//注意：{

{title}}这是对内容编码输出，应该写成{ {#title}}这是对内容不编码输出

var data = {    title:"
hello world
"};var html = template("test",data);document.getElementById('content').innerHTML = html;

流程控制语句（if else）

{

{if value}} … { {else if value}} … { {else}} … { {/if}} art-template里面的流程控制就相对其他模板来说强大很多了，直接看例子吧

嵌套的写法

循环遍历语句

{

{each name}} 索引：{ {$index}} 值：{ {$value}} { {/each}}

调用自定义方法

通过template.helper(name,fnCallBack)注册方法 可以直接在{

{}}中调用

调用子模板

{

{include 'main'}} 引入子模板，数据默认为共享 { {include 'main' a}} a为制定数据，但是同样必须是父级数据，可以看看下面的例子，如果不注入的a的话，引入的子模板是接受不到数据的