<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="jquery.min.js"></script>
<script src="art-template.js"></script> </head>
<body> <!--页面内容区-->
<div id="content"></div> <!--处理区-->
<script id="test" type="text/html">
<h1>{{title}}</h1>
<ul>
{{each list as value i}}
<li>索引 {{i + 1}} ：{{value}}</li>
{{/each}}
</ul> </script> <script>
var data = {
title: '基本例子',
list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
};
var html = template('test', data);//渲染到处理区
document.getElementById('content').innerHTML = html;//渲染到页面内容区 </script> </body>
</html>
结果如下：
art-template.js下载地址：https://raw.githubusercontent.com/aui/art-template/master/lib/template-web.js
官网文档：https://aui.github.io/art-template/zh-cn/docs/installation.html