<!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>
时间: 2024-10-16 22:32:08