码迷,mamicode.com
首页 > Web开发 > 详细

jsrender简单使用

时间:2015-07-24 00:19:30      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:

{{* ... }} and {{*: ...}}

<!DOCTYPE html>
<!-- To run the current sample code in your own environment, copy this to an html page. -->

<html>
<head>
  <script src="//code.jquery.com/jquery-1.11.2.js"></script>
  <base href="//www.jsviews.com/samples/"/>
  <link href="samples.css" rel="stylesheet"/>
  <script src="./../download/jsrender.js"></script>
</head>
<body>

<div id="result"></div>

<script id="theTmpl" type="text/x-jsrender">
<div>
   <em>Name:</em> {{:name}}
   {{if showNickname && nickname}}
      (Goes by <em>{{:nickname}}</em>)
   {{/if}}
</div>
</script>

<script>
var data = [
  {
    "name": "Robert",
    "nickname": "Bob",
    "showNickname": true
  },
  {
    "name": "Susan",
    "nickname": "Sue",
    "showNickname": false
  }
];

var template = $.templates("#theTmpl");

var htmlOutput = template.render(data);

$("#result").html(htmlOutput);
</script>

</body>
</html>





jsrender简单使用

标签:

原文地址:http://my.oschina.net/cng1985/blog/483129

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!