html渲染1模板,jq模板渲染数据.html

.container {

width: 1000px;

height: 600px;

margin: 0 auto;

}

.template {

display: none;

}

table {

background-color: #fff;

}

table tr th {

padding: 8px;

border-bottom: 1px solid #eee;

}

table tr td {

padding: 10px;

border-bottom: 1px solid #eee;

}

部门编号：{$T.list_id}

部门负责人：{$T.name}

编号	姓名	年龄	邮箱	性别

{#foreach $T.table as record}

{$T.record.id}{$T.record.name}{$T.record.age}{$T.record.mail}{$T.record.sex}

{#/for}

------------上面是多维数组，下面是单维数组----------

编号	姓名	年龄	邮箱	性别

{#foreach $T as record}

{$T.record.id}{$T.record.name}{$T.record.age}{$T.record.mail}{$T.record.sex}

{#/for}

var data = {

"name": "网马伦",

"list_id": 89757,

"table": [

{"id": 1, "name": "Rain", "age": 22, "mail": "admin@domain.com","sex":"man"},

{"id": 2, "name": "皮特", "age": 24, "mail": "123456@domain.com","sex":"man"},

{"id": 13, "name": "卡卡", "age": 20, "mail": "112233@domain.com","sex":"man"}

]

};

$("#result").setTemplateElement("template");

$("#result").processTemplate(data);

var table=[

{"id": 13, "name": "卡卡", "age": 20, "mail": "112233@domain.com","sex":"man"},

{"id": 4, "name": "戏戏", "age": 26, "mail": "0147@domain.com","sex":"man"},

{"id": 5, "name": "一揪", "age": 25, "mail": "kkw@domain.com","sex":"man"}

]

$("#result1").setTemplateElement("template1");

$("#result1").processTemplate(table);

一键复制

编辑

Web IDE

原始数据

按行查看

历史