首页 > 代码库 > JsRender系列demo(6)-无名

JsRender系列demo(6)-无名

2024-07-14 08:59:19   224人阅读

<!DOCTYPE html><html><head>	<script src="http://code.jquery.com/jquery.js" type="text/javascript"></script>	<script src="http://www.mamicode.com/jsrender.js" type="text/javascript"></script>	<link href="http://www.mamicode.com/resources/demos.css" rel="stylesheet" type="text/css" />	<link href="http://www.mamicode.com/resources/movielist.css" rel="stylesheet" type="text/css" /></head><body><a href="http://www.mamicode.com/demos.html">JsRender Demos</a><br /><h3>Template composition. Using external templates for block tags, such as {{for}} and {{if}}.</h3><script id="movieTemplate" type="text/x-jsrender">	<tr>		<td>{{include tmpl="#headerTemplate"/}}</td>		<td>			{{for languages tmpl="#columnTemplate"/}}		</td>		<td>			{{for languages tmpl=tmpl/}}		</td>		<td>			{{for languages tmpl=‘#conditionalTemplate‘/}}		</td>		{{include tmpl="#sectionWrapperTemplate"}}			{{>title}}		{{/include}}		<td>			{{for languages tmpl=‘#indexWrapperTemplate‘}}				<b>{{>name}}</b>			{{/for}}		</td>	</tr></script><script id="headerTemplate" type="text/x-jsrender">	<td>{{>title}}</td></script><script id="sectionWrapperTemplate" type="text/x-jsrender">	<td>Section: <em>{{include tmpl=#content/}}</em></td></script><script id="columnTemplate" type="text/x-jsrender">	<div>		<em>{{>name}}</em>	</div></script><script id="rowTemplate" type="text/x-jsrender">	<span>		<b>{{>name}}</b>	</span></script><script id="conditionalTemplate" type="text/x-jsrender">	{{if name.charAt(0)===‘E‘ tmpl=‘#rowTemplate‘}}	{{else tmpl=‘#columnTemplate‘}}	{{/if}}</script><script id="indexWrapperTemplate" type="text/x-jsrender">	<div>		{{:#index}}:		{{include tmpl=#content/}}	</div></script><table>	<thead><tr><th>Synopsis</th><th>Fixed Template</th><th>Template specified in data</th><th>Conditional Template</th><th>Wrapper Template</th><th>Repeating Wrapper Template</th></tr></thead>	<tbody id="movieList"></tbody></table><script type="text/javascript">	var movies = [		{			title: "Meet Joe Black",			languages: [				{ name: "English" },				{ name: "French" }			],			tmpl: "#columnTemplate"		},		{			title: "Eyes Wide Shut",			languages: [				{ name: "French" },				{ name: "Esperanto" },				{ name: "Spanish" }			],			tmpl: "#rowTemplate"		},		{			title: "The Inheritance",			languages: [				{ name: "English" },				{ name: "German" }			],			tmpl: "#columnTemplate"		}	];	$( "#movieList" ).html(		$( "#movieTemplate" ).render( movies )	);</script></body></html>

　　


联系
我们