template.js——前端模板引擎

1. 什么情况下推荐使用template.js

（1）在你的页面布局中存在一样的模块，可以提出公共的模块，便于维护

注：此处用到循环来减少工作量

 

 

对应代码如下：

<!--li作为一个公共模块被提取出来作为模板-->
<ul class="cbp_tmtimeline" id="log">
<script id="logTpl" type="text/html">
	{{each data as value i}}
		<li>
			<div class="cbp_tmicon_y"></div>
			<div class="cbp_tmlabel" operator="{{value.operator}}">
			   <div class="t">
						<span class="title">{{value.displayName}}</span>
						<span class="title2"> </span>
				</div>
			<span class="note">{{value.variable}}</span>
			<div class="info">
			<div class="author"><span class="mui-icon mui-icon-person"></span>{{value.operatorName}}</div>
			<div class="date">{{value.finishTime}}</div>
			</div>
		</div>
		</li>
	{{/each}}
</script>
</ul>

js部分代码:

document.getElementById("log").innerHTML = template("logTpl", {
	data: data,
	next : nextStatus
});

(2) 将通过ajax获取到的数据展示到页面,使用template可以更方便效率。

2. Template.js使用详解

http://blog.csdn.net/pupilxiaoming/article/details/77118855