您的位置：首页 > Web前端 > JavaScript

doT.js初窥二

2015-09-30 16:05 501 查看

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
		<script type="text/javascript" src="js/doT.js" ></script>
	</head>
	<body>
		<div id="result_div">
		</div>
	
		<script id="j-tmpl" type="text/template">
			{{ if(it.success) { }}
				<h2>results</h2>
				<ul>
					{{ for(var i = 0, len = it.data.length; i < len; i++) { }}
						<li>
							<h5>{{=it.data[i].title}}</h5>
							<p>{{!it.data[i].message}}</p>
						</li>
					{{ } }}
				</ul>
			{{ }else { }}
				<h2>暂无数据</h2>					
			{{ } }}
		</script>
		
		<script>
			var obj = {
				success: true,
				data: [
					{'title': 'item1', 'message': 'hello'},
					{'title': 'item2', 'message': 'world'}
				]
			};
			
			var tmpl = $('#j-tmpl').html();
			var doTtmpl = doT.template(tmpl);
			
			$('#result_div').html(doTtmpl(obj));
			
		</script>
	</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航