如何使用jquery将json数据显示为表格式。 [英] How can I display json data into table format using jquery.
本文介绍了如何使用jquery将json数据显示为表格式。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
<string xmlns="http://tempuri.org/">
{"traffic":[{"domain":{"name":"abcabanderadas.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":507,"availability":"3/26/2016"}},{"domain":{"name":"abcbidders.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":764,"availability":"3/24/2016"}},{"domain":{"name":"abcd4web.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":539,"availability":"3/27/2016"}},{"domain":{"name":"abcdadieta.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":1113,"availability":"3/27/2016"}},{"domain":{"name":"abcdatacodigos.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":531,"availability":"3/27/2016"}},{"domain":{"name":"abcdbrageac.com","inboundLinks":0,"thirtyDayScore":9.3,"dnsTrafficReach":122,"availability":"3/23/2016"}},{"domain":{"name":"abcdefghijklmn-opqrstuvwsyz.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":503,"availability":"3/24/2016"}},{"domain":{"name":"abcdeliverysystems.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":330,"availability":"3/27/2016"}},{"domain":{"name":"abcdenverchannel.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":570,"availability":"3/27/2016"}},{"domain":{"name":"abcdishylicious.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":422,"availability":"3/24/2016"}},{"domain":{"name":"abcdomainhost.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":1040,"availability":"3/26/2016"}},{"domain":{"name":"abcdonate.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":558,"availability":"3/23/2016"}},{"domain":{"name":"abcdoorcolorado.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":476,"availability":"3/26/2016"}},{"domain":{"name":"abcdwin.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":448,"availability":"3/27/2016"}},{"domain":{"name":"abcdyi.com","inboundLinks":0,"thirtyDayScore":9.3,"dnsTrafficReach":400,"availability":"3/24/2016"}},{"domain":{"name":"abckidsacdemy.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":565,"availability":"3/25/2016"}},{"domain":{"name":"abcmobiledesign.net","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":481,"availability":"3/26/2016"}},{"domain":{"name":"abcsitedesign.com","inboundLinks":19,"thirtyDayScore":9.5,"dnsTrafficReach":14016,"availability":"3/23/2016"}},{"domain":{"name":"guarderiaabc.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":0,"availability":"3/27/2016"}},{"domain":{"name":"insideabc.com","inboundLinks":0,"thirtyDayScore":9.3,"dnsTrafficReach":730,"availability":"3/24/2016"}},{"domain":{"name":"prodecabcn.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":436,"availability":"3/27/2016"}}]}
</string>
这是我从服务中获得的json响应
我尝试了什么：
我是获取数据但我无法在html表中显示它。
this is the json response what i am getting from service
What I have tried:
I am getting the data but i am unable to display it in the html table.
推荐答案
您好，这就是我所做的。我希望它有帮助
Hello, Here is what I have done. I hope it helps
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Handling JSON Data demo</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<!--script src="js/jquery-1.10.2.min.js"></script-->
<script>
（ document ）。ready（ function （）{
var xml = ' < string xmlns =http://tempuri.org/> [{traffic：[{domain：{name：abcabanderadas .COM inboundLinks：0 thirtyDayScore：9.5， dnsTrafficReach：507， 可用性： 2016年3月26日}}，{ 域：{ 名称： abcbidders.com inboundLi NKS ：0， thirtyDayScore ：9.4，dnsTrafficReach ：764， 可用性 ： 2016年3月24日 }}，{ 域 ：{ 名称 ： abcd4web.com， inboundLinks ：0， thirtyDayScore：9.4 dnsTrafficReach：539， 可用性： 2016年3月27日}}，{ 域：{ 名称： abcdadieta.com， inboundLinks：0 thirtyDayScore：9.5， dnsTrafficReach：1113， 可用性： 2016年3月27日}}，{ 域：{ 名称： abcdatacodigos.com， inboundLinks：0， thirtyDayScore ：9.4，dnsTrafficReach ：531， 可用性 ： 2016年3月27日 }}，{ 域 ：{ 名称 ： abcdbrageac.com， inboundLinks：0， thirtyDayScore ：9.3， dnsTrafficReach：122， 可用性： 2016年3月23日}}，{ 域：{ 名称： abcdefghijklmn-opqrstuvwsyz.com， inboundLinks：0， thirtyDayScore ：9.4， dnsTrafficReach：503， 可用性： 2016年3月24日}}，{ 域：{ 名称： abcdeliverysystems.com， inboundLinks：0 thirtyDayScore：9.5 dnsTrafficReach：330， 可用性： 2016年3月27日}}，{ 域：{ 名称： abcdenverchannel.com， inboundLinks：0 thirtyDayScore：9.4， dnsTrafficReach ：570， 可用性 ： 2016年3月27日 }}，{ 域 ：{ 名： abcdishylicious.com， inboundLinks：0 thirtyDayScore：9.5， dnsTrafficReach：422， 可用性： 2016年3月24日}}，{ 域：{ 名称：abcdomainhost .COM inboundLinks：0 thirtyDayScore：9.4 dnsTrafficReach：1040， 可用性： 2016年3月26日}}，{ 域：{ 名称： abcdonate.com ， inboundLinks：0 thirtyDayScore：9.5， dnsTrafficReach：558， 可用性： 2016年3月23日}}，{ 域：{ 名称： abcdoorcolorado.com， inboundLinks：0 thirtyDayScore：9.4 dnsTrafficReach：476， 可用性： 2016年3月26日}}，{ 域：{ 名称： abcdwin.com，inboundLinks ：0， thirtyDayScore ：9.4，dnsTrafficReach ：448， 可用性 ： 2016年3月27日 }}，{ 域 ：{ 名称 ： abcdyi.com， inboundLinks： 0 thirtyDayScore：9.3 dnsTrafficReach：400， 可用性： 2016年3月24日}}，{ 域：{ 名称： abckidsacdemy.com， inboundLinks：0， thirtyDayScore：9.5， dnsTrafficReach：565， 可用性： 2016年3月25日}}，{ 域：{ 名称： abcmobiledesign.net， inboundLinks：0，thirtyDayScore ：9.5， dnsTrafficReach ：481， 可用性 ： 2016年3月26日 }}，{ 域 ：{命名 ： abcsitedesign.com， inboundLinks：19， thirtyDayScore：9.5， dnsTrafficReach：14016， 可用性： 2016年3月23日}}，{ 域：{ 名 ： guarderiaabc.com， inboundLinks：0 thirtyDayScore：9.4 dnsTrafficReach：0， 可用性： 2016年3月27日}}，{ 域：{ 名称： insideabc.com inboundLinks：0 thirtyDayScore：9.3 dnsTrafficReach：730， 可用性： 2016年3月24日}}，{ 域：{ 名称： prodecabcn。 com，inboundLinks：0，thirtyDayScore：9.5，dnsTrafficReach：436，availability：3/27/2016}}]}]< / string>'，
xmlDoc =
(document).ready(function(){ var xml = '<string xmlns="http://tempuri.org/">[{"traffic":[{"domain":{"name":"abcabanderadas.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":507,"availability":"3/26/2016"}},{"domain":{"name":"abcbidders.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":764,"availability":"3/24/2016"}},{"domain":{"name":"abcd4web.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":539,"availability":"3/27/2016"}},{"domain":{"name":"abcdadieta.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":1113,"availability":"3/27/2016"}},{"domain":{"name":"abcdatacodigos.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":531,"availability":"3/27/2016"}},{"domain":{"name":"abcdbrageac.com","inboundLinks":0,"thirtyDayScore":9.3,"dnsTrafficReach":122,"availability":"3/23/2016"}},{"domain":{"name":"abcdefghijklmn-opqrstuvwsyz.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":503,"availability":"3/24/2016"}},{"domain":{"name":"abcdeliverysystems.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":330,"availability":"3/27/2016"}},{"domain":{"name":"abcdenverchannel.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":570,"availability":"3/27/2016"}},{"domain":{"name":"abcdishylicious.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":422,"availability":"3/24/2016"}},{"domain":{"name":"abcdomainhost.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":1040,"availability":"3/26/2016"}},{"domain":{"name":"abcdonate.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":558,"availability":"3/23/2016"}},{"domain":{"name":"abcdoorcolorado.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":476,"availability":"3/26/2016"}},{"domain":{"name":"abcdwin.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":448,"availability":"3/27/2016"}},{"domain":{"name":"abcdyi.com","inboundLinks":0,"thirtyDayScore":9.3,"dnsTrafficReach":400,"availability":"3/24/2016"}},{"domain":{"name":"abckidsacdemy.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":565,"availability":"3/25/2016"}},{"domain":{"name":"abcmobiledesign.net","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":481,"availability":"3/26/2016"}},{"domain":{"name":"abcsitedesign.com","inboundLinks":19,"thirtyDayScore":9.5,"dnsTrafficReach":14016,"availability":"3/23/2016"}},{"domain":{"name":"guarderiaabc.com","inboundLinks":0,"thirtyDayScore":9.4,"dnsTrafficReach":0,"availability":"3/27/2016"}},{"domain":{"name":"insideabc.com","inboundLinks":0,"thirtyDayScore":9.3,"dnsTrafficReach":730,"availability":"3/24/2016"}},{"domain":{"name":"prodecabcn.com","inboundLinks":0,"thirtyDayScore":9.5,"dnsTrafficReach":436,"availability":"3/27/2016"}}]}]</string>', xmlDoc =
.parseXML（xml），
.parseXML( xml ),
这篇关于如何使用jquery将json数据显示为表格式。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
