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

1、下载json2html>>

2、制作好模板、准备好json数据、启动

复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>json2html</title>
<script type="text/javascript" src="json2html.js"></script>
</head>
<body>
<script type="text/javascript">
//html模板格式
var transform = {'tag':'p','html':'${name} (${age})'};
    
//json数据
var data = [
    {'name':'Bob','age':40},
    {'name':'Frank','age':15},
    {'name':'Bill','age':65},
    {'name':'Robert','age':24}
];
//启动
        document.write(json2html.transform(data,transform));
</script>
</body>
</html>
复制代码

输出html代码：

<p>Bob (40)</p>
<p>Frank (15)</p>
<p>Bill (65)</p>
<p>Robert (24)</p>

 

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

喜欢请打赏

扫描二维码打赏

了解更多