利用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/

posted @   tinyphp  Views(1508)  Comments(0Edit  收藏  举报
编辑推荐:
· 软件产品开发中常见的10个问题及处理方法
· .NET 原生驾驭 AI 新基建实战系列:向量数据库的应用与畅想
· 从问题排查到源码分析:ActiveMQ消费端频繁日志刷屏的秘密
· 一次Java后端服务间歇性响应慢的问题排查记录
· dotnet 源代码生成器分析器入门
阅读排行:
· ThreeJs-16智慧城市项目(重磅以及未来发展ai)
· .NET 原生驾驭 AI 新基建实战系列(一):向量数据库的应用与畅想
· Ai满嘴顺口溜,想考研?浪费我几个小时
· Browser-use 详细介绍&使用文档
· 软件产品开发中常见的10个问题及处理方法
点击右上角即可分享
微信分享提示

喜欢请打赏

扫描二维码打赏

了解更多