JavaScript模板引擎:doT.js

doT.js模板引擎
我总结的特点是:简单易用、速度快、不依赖其他库,连玩带学只需20分钟即能学会。当然功能肯定会有限制。
下载地址
http://jinlong.github.io/doT/
教程参看
http://blog.csdn.net/chuyuqing/article/details/46795457
http://www.51xuediannao.com/js/texiao/dot.html
http://www.tuicool.com/articles/QBBZFn

上较为复杂的代码:

<!-- 定义模板 -->
<script id="nameTemp" type="text/x-dot-template">
    姓名:{{=it.name}}
</script>
<!-- 显示数据的位置 -->
<div id="name"></div><hr />

<!-- 定义模板 -->
<script id="titleTemp" type="text/x-dot-template">
    {{~it.article:value:index}}
        <p>{{= index+1 }}.{{= value.title }}&nbsp;&nbsp;赞:
        {{~value.like:value2}}
            {{= value2.name }}&nbsp;&nbsp;
        {{~}}
        </p>
    {{~}}
</script>
<!-- 显示数据的位置 -->
<div id="title"></div><hr />    	

it表示当前数据

//定义数据
var interationData =  
{
    "name":"小明",
    "age":20,
    "article":
    [
        {
            "id":"1",
            "title":"学习apicloud",
            "content":"alskdjf",
            "like":
            [
                {
                    'id':'1111',
                    'name':'伽利略'
                },
                {
                    'id':'222',
                    'name':'哥白尼'
                }
            ]
        },
        {
            "id":"2",
            "title":"学习js",
            "content":"alskdjf",
            "like":[]
        },
        {
            "id":"3",
            "title":"html",
            "content":"alskdjf",
            "like":[]
        }
    ]
};  

//编译模板
var interation = doT.template( $('#nameTemp').html() );
//将数据显示到网页中
$( '#name' ).html(interation( interationData ));

//编译模板
var interation = doT.template( $('#titleTemp').html() );
//将数据显示到网页中
$( '#title' ).html(interation( interationData ));


for语句嵌套if else if语句判断

{{~it:value:index}}
    {{? value.status=== 1}}已发布
		{{?? value.status === -10}}已发布
		{{?? value.status === -20}}草稿
		{{?? value.status === -30}}被拒绝
    {{?}}
{{~}}


代码下载:http://pan.baidu.com/s/1qXGFrPy

for语句嵌套if、else if、else语句判断

{{~it:value:index}}
    {{? value.status=== 1}}已发布
		{{?? value.status === -10}}已发布
		{{?? value.status === -20}}草稿
		{{?? value.status === -30}}被拒绝
		{{?? }}其他
    {{?}}
{{~}}





原文出处:/show_1C71L3WLAPI2.html