# 模板引擎 模板引擎概述 作用:使用模板引擎提供的模板语法，可以将数据和HTML拼接起来。 官方地址:[https://aui.github.io/art-template/zh-cn/index.html](https://aui.github.io/art-template/zh-cn/index.html) [https://aui.github.io/art-template/zh-cn/docs/installation.html](https://aui.github.io/art-template/zh-cn/docs/installation.html)\## 在浏览器中实时编译 右击链接另存为 使用步骤 1.下载art-template模板引擎库文件并在HTML页面中引入库文件 ~~~ <script src="./js/template-web.js"></script> ~~~ 2.准备art-template模板 ~~~ <script id ="tpl" type="text/html"> <div class "box"></div> </ script> ~~~ 3.告诉模板引擎将哪一个模板和哪个数据进行拼接 ~~~ var html = template('tpl', {username: ' zhangsan'，age: '20'}) ; ~~~ 4.将拼接好的html字符串添加到页面中 ~~~ document. getElementById('container') . innerHTML = html; ~~~ 5.通过模板语法告诉模板引擎,数据和htm|字符串要如何拼接 ~~~ <script ide ="tpl" type="text/html"> <div class= ="box"> {{ username }} </div> </script> ~~~