关于mustacheJS模板渲染页面内容

mustache下载地址

首先提供渲染的数据是JS的JSON数据，然后根据提供的模板样式去渲染。

<div id="template" style="display:none">
  <h1>{{title}}</h1>
	{{#content}}
	  {{#first}}
		<li><font style="color:red">{{name}}</font></li>
	  {{/first}}
	  {{#second}}
		<li><a href="{{url}}">{{name}}</a></li>
	  {{/second}}
	{{/content}}
	<li><img src="{{img}}" border="0" alt=""></li>
</div>
<div id="content"></div>
<script type="text/javascript">	
	 var html = document.getElementById("template").innerHTML;
	 var json = {	
	  "title":"The title",
	  "content": [
		  {"name": "lily", "first": true},
		  {"name": "Lucy", "second": true, "url": "http://www.haohaoup.com"},
		  {"name": "Andy", "second": true, "url": "http://www.haohaoup.com"}
	   ],
	   "img":"http://avatar.csdn.net/4/5/F/1_yiyaqin1990.jpg"
	 };
	var _html = Mustache.to_html(html,json);
	document.getElementById("content").innerHTML = _html;
  </script>