art-template 的基本使用

1. 下载并导入 art-template 模板引擎

下载到本地后，通过 <script> 标签加载到网页上进行使用

<!-- 在 window 全局，会多一个函数 template('模板的Id', 需要渲染的数据对象) -->
<script src="./li/template-web.js"></script>

2. 定义数据

let data = {name: 'yy'}

3. 定义模板

<!-- 3.1 模板的 HTML 结构，必须定义到 script 中 -->
<!-- {{}} 在 template 里代表占位符 --> 
<!-- type="text/html" 表示将这个 script 标签里的内容当作 html 解析 --> 

<script type="text/html" id="tpl-person">  
	{{name}}
</script>

4. 调用 template 函数

// template('模板的ID', 需渲染的数据) 
let htmlStr = template('tpl-person', data)  
console.log(htmlStr)

5. 渲染HTML结构

<div id='container'>  </div>

$('#container').html(htmlStr)