利用tempo将json数据填充到html模板

1、下载tempo

2、使用

<!DOCTYPE html>
<html>
<head lang="zn-ch">
<meta charset="UTF-8">
<title>tempo</title>
<!--引入tempo -->
<script type="text/javascript" src="tempo.min.js"></script>
</head>
<body>

<script>
//json数据
var data = [
    {'name':'Bob','age':40},
    {'name':'Frank','age':15},
    {'name':'Bill','age':65},
    {'name':'Robert','age':24}
];
//处理
    window.onload = function () {
        Tempo.prepare('list').render(data);
    }
</script>
<!--id为list的内容为模板 -->
<ol id="list">
    <li data-template>{{name}}</li>
</ol>
</body>
</html>

官网阅读:

http://twigkit.github.io/tempo/

原文地址:https://www.cnblogs.com/tinyphp/p/4910519.html