对于服务器端使用过art-template和express-art-express来做模板和数据的拼接
对于客户端也有模板引擎可以使用:template-web
使用方法
1、下载template-web.js文件(我放到了前台页面所在目录下的js目录下)
2、在客户端文件中引入模板引擎文件
<script src="/js/template-web.js"></script>
3、使用模板
使用script标签包裹模板框架,为script标签添加 id 以便模板引擎可以找到目标模板
script的内容类型设定为"text/html"
<body>
<div id="container"></div>
<!-- 准备template模板 -->
<script type="text/html" id="tpl">
<h1>{{username}}{{age}}</h1>
</script>
<script type="text/javascript">
// 3.告诉模板引擎将哪个数据和哪个模板进行拼接
// 1、模板id 2、数据(对象类型)
var html = template('tpl', {
username: 'zhangsan',
age: 20
});
//拼接好的内容添加到页面中
document.getElementById('container').innerHTML = html;
</script>
</body>