<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>简介语法</title>
</head>
<body>
<div id="box"></div>
<!--**注意** 模版当中没有其他全局变量 -->
<!--
<% for(var i = 0 ; i < model.length ; i ++){ %>
<%=model[i].name%>今年<%=model[i].age%><br>
<% }; %>
-->
<!--
{{ each model as value i }}
{{value.name}}今年{{value.age}}<br>
{{/each}}
-->
<script type="text/template" id="box_template">
{{ each model}}
{{$index}} {{$value.name}}今年{{$value.age}}<br>
{{/each}}
</script>
<!--原生语法的js native-->
<script src="js/template.js"></script>
<script src="js/jquery.min.js"></script>
<script>
/*1.准备数据*/
var dataList = [
{name:'xgg',age:'10'},
{name:'xgg',age:'12'},
{name:'xgg',age:'13'},
{name:'xgg',age:'14'},
{name:'xgg',age:'18'}
]
/*2.转化数据成html*/
var html = template('box_template',{model:dataList});
/*3.渲染*/
document.querySelector('#box').innerHTML = html;
</script>
</body>
</html>