json字符串在html中，怎么转换成表格展示？

{
"response":{
"numFound":"2",
"start":"0",
"docs":[
{
"id":"857400f2-b680-4de1-b9d1-5ea107f6f362",
"agentId":"ServicePlatform_Infrastructure_CPU-Usage",
"category":"Infrastructure",
"subCategory":"CPU-Usage",
"thirdCategory":"N/A",
"dataAcquistionTime":"1496332066849",
"optional":"",
"label":"CPU使用率",
"data":"98%",
"data_i":"98",
"data_f":"0",
"optionData_f":"0",
"option2Label":"",
"option2Data":"",
"option2Data_f":"0",
"option3Label":"",
"option3Data":"",
"option3Data_f":"0",
"seqNo":"0",
"_version_":"1569048833034289200"
}
]
}
}

 这样的json，在html怎么解析成表格？求代码

写回答
好问题 0 提建议
追加酬金
关注问题
分享
邀请回答
编辑收藏删除结题
收藏举报

7条回答默认最新

全栈极简博客专家认证 2017-06-02 03:34

关注

 <html>
<head>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
    <script type="text/javascript">
        $(function(){
            var json ="{\"response\": {\"numFound\": \"2\",\"start\": \"0\",\"docs\": [{\"id\": \"857400f2-b680-4de1-b9d1-5ea107f6f362\",\"agentId\": \"ServicePlatform_Infrastructure_CPU-Usage\",\"category\": \"Infrastructure\",\"subCategory\": \"CPU-Usage\",\"thirdCategory\": \"N/A\",\"dataAcquistionTime\": \"1496332066849\",\"optional\": \"\",\"label\": \"CPU使用率\",\"data\": \"98%\",\"data_i\": \"98\",\"data_f\": \"0\",\"optionData_f\": \"0\",\"option2Label\": \"\",\"option2Data\": \"\",\"option2Data_f\": \"0\",\"option3Label\": \"\",\"option3Data\": \"\",\"option3Data_f\": \"0\",\"seqNo\": \"0\",\"_version_\": \"1569048833034289200\"}]}}";

            var elements = JSON.parse(json).response.docs;
            for(var i = 0;i<elements.length;i++){
                $("#tt").append("<tr>");
                $("#tt").append("<td width='5%'>"+elements[i].id+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].agentId+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].category+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].subCategory+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].thirdCategory+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].dataAcquistionTime+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].optional+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].label+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].data+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].data_i+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].data_f+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].optionData_f+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].option2Label+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].option2Data+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].option2Data_f+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].option3Label+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].option3Data+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].option3Data_f+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i].seqNo+"</td>");
                $("#tt").append("<td width='5%'>"+elements[i]._version_+"</td>");
                $("#tt").append("</tr>");
            }
        });

    </script>
</head>
<body>
    <table id="tt" border="1" cellspacing="0" cellpadding="0">
    </table>
</body>
</html>

本回答被题主选为最佳回答 , 对您是否有帮助呢?

查看更多回答(6条)

报告相同问题？

关注问题

如何将AJAX检索到的JSON格式的字符串转换为格式化的表格 ajax html javascript php
2019-03-25 12:08

回答 4 已采纳 If you want your myObj in a format like table, then there is nothing that automatically converts f
JS如何在循环生成的表格中计算？ javascript 前端
2023-04-13 06:57

回答 4 已采纳按照以下步骤，应该能完成你的需求 1 获取表格数据：通过 JavaScript 获取生成的表格数据，可以使用 document.getElementsByTagName() 或 document.qu
各位大佬，关于PHP转换json之后，js接收报错，求解！ html5 javascript mysql php
2019-07-08 17:03

回答 2 已采纳可以了加了下面代码 ``` /************************************************************** * * 使
JS实现将二维数组转为json格式字符串操作示例
2020-10-18 08:58

这是为了确保在转换为JSON字符串时，不会丢失对象的自定义toString方法中定义的字符串表示。在了解了这些操作技巧之后，通过示例代码的运行，我们可以得到转换后的JSON字符串。这些字符串可以用于网络传输、本地...
ajax 发送请求与接收请求，不在表格中显示 ajax java javascript
2021-10-26 11:28

回答 5 已采纳根据你上面的代码，我感觉是你调用错函数了吧，show(result)这个函数应该才是增加歌曲的吧showData(data) 这个看上去是显示用户名和密码的
前端拿到后端返回的数据显示[object Object]怎么处理 javascript json 前端
2022-03-24 13:59

回答 2 已采纳找个第三方调接口看下，正常第三方工具都会自己解析数据的，工具能解析出来的话，那就是你代码转换格式有问题了
求助前端大神，怎么把后端接口的数据的拼接到html的table里 javascript 有问必答
2021-06-01 17:37

回答 4 已采纳我可以给你写demo，私信
js与jQuery实现获取table中的数据并拼成json字符串操作示例
2020-10-18 09:20

当运行这些代码后，将表格数据转换成的JSON字符串会显示在`#test`的div中，如下所示： ```json [ {"编号":1,"年龄":25,"单元":1,"房间号":"1-2"}, {"编号":2,"年龄":22,"单元":1,"房间号":"1-1"}, {"编号":3,...
请问一下，我使用ajax传递form数据，其中的空格在请求时被转成了加号怎么处理？ ajax django
2021-04-09 22:41

回答 1 已采纳 1.为+与&符号编码;data.replace(/\+/g, "%2B");data.replace(/\&/g, "%26"); 2.前端传值格式化（序列化） encode，后端获取数据dec
bootstrap的datatable中，自定义了radio，如何通过点击单选获取行数据？ bootstrap django jquery
2023-01-20 15:29

回答 1 已采纳若对您的问题有帮助，望采纳 1.您可以使用 jQuery 的 on() 方法来绑定单选框的 click 事件，而不是使用 onclick 属性。例如： $(document).on("click",
bootstrap的datatable重新加载数据后，为什么样式失效（分页、搜索不能用）？ bootstrap django jquery
2023-01-24 11:18

回答 3 已采纳相当于二次多次加载页面出错，那你需要在ajax中考虑到多次加载的问题啊，我看你是在里面动态生成页面元素，那你是不是要考虑，二次加载时，之前生成的页面元素要清空
vue——json对象和json字符串的转换
2022-02-16 22:47

三月的一天的博客前后端分离开发中，后端返回的接口中的数据是json字符串格式，而前端需要json字符串格式，如何进行json字符串和json对象之间的相互转换
axios error 500 vue.js 前端
2022-10-12 20:37

回答 2 已采纳你找后端看一下你传参有没有问题，如果没问题那就是后端的问题
html数据转换成表格,JSON数据转换成table表格
2021-06-09 12:50

weixin_39929646的博客 <%@ page contenttype="text/html; charset=utf-8" %> <%@taglib uri="/struts-tags" prefix="s"%> <%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%> (); string basepath = request.getscheme()+"://...
javascript解析json格式的字符串，拼接后显示到表格中
2022-02-13 16:05

唐维康的博客解析json格式的字符串 拼接的HTML设置到tbody当中加载json格式的对象结果演示 html代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>拼接HTML</title&...
没有解决我的问题, 去提问

悬赏问题

¥15 做个有关计算的小程序
¥15 MPI读取tif文件无法正常给各进程分配路径
¥15 如何用MATLAB实现以下三个公式（有相互嵌套）
¥30 关于#算法#的问题：运用EViews第九版本进行一系列计量经济学的时间数列数据回归分析预测问题求各位帮我解答一下
¥15 setInterval 页面闪烁，怎么解决
¥15 如何让企业微信机器人实现消息汇总整合
¥50 关于#ui#的问题：做yolov8的ui界面出现的问题
¥15 如何用Python爬取各高校教师公开的教育和工作经历
¥15 TLE9879QXA40 电机驱动
¥20 对于工程问题的非线性数学模型进行线性化

码龄粉丝数原力等级 --

json字符串在html中，怎么转换成表格展示？

7条回答默认最新

码龄粉丝数原力等级 --

悬赏问题

json字符串在html中，怎么转换成表格展示？

7条回答 默认 最新

悬赏问题

7条回答默认最新