<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="div_demo">
</div>
<script id="demo" type="text/x-jquery-tmpl">
<div style="margin-bottom: 10px;">
<span>${ID}</span>
<span style="margin-left: 10px;">{{= Name}}</span>
<span style="margin-left: 10px;">${Number(Num)+1}</span>
<span style="margin-left: 10px;">${Status}</span>
</div>
</script>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
<script src="js/jquery.tmpl.js"></script>
<script type="text/javascript">
var users = [
{
ID: 'c8848',
Name: '陳國雄',
Num: '1',
Status: 1
}, {
ID: 'amy001',
Name: '張瑪莉',
Num: '2'
}
];
$("#demo").tmpl(users).appendTo('#div_demo');
</script>
<!-- 數據拼接形式 -->
<script type="text/javascript">
$.tmpl("<ul><li>${Name}</li></ul>", { "Name": "John Doe" }).appendTo("#div_demo");
</script>
</body>
</html>
如圖:
