template模板引擎的简单例子

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script src="template这个版本是可以用的.js"></script>
</head>
<body>
<div id="box"></div>
</body>
<script type="text/html" id="tpl">
	<h1>{{title}}</h1>
	<ul>
		{{each arr as value index}}
		<li>{{value}}---->{{index}}</li>
		{{/each}}
	</ul>
	<ul>
		{{each json as value item}}
		<li>{{value}}---->{{item}}</li>
		{{/each}}
	</ul>
</script>
<script>
	var data={
		title:"hello world",
		arr:["apple","pear","orange"],
		json:{
			a:1,b:2,c:3
		}
	};
	window.onload=function(){
		var  oBox=document.getElementById('box')
		var sHTML=template("tpl",data)
		oBox.innerHTML=sHTML
	}
</script>
</html>

猜你喜欢

转载自blog.csdn.net/qq_39047764/article/details/81393534