将json 中的数据简单按照表格显示

最新推荐文章于 2023-11-22 00:46:34 发布

大巨魔战将

最新推荐文章于 2023-11-22 00:46:34 发布

阅读量1.7k

点赞数

本文链接：https://blog.csdn.net/bianfu2008zhi/article/details/75007424

版权

<!DOCTYPE html>
<head>
</head>
<body>
	<table id="tb" border="1">

	</table>
	
	<script type="text/javascript">
		
		var json = {

			data : {
				"count" : 4,
				"currPage" : 1,
				"totalPage" : 1,
				"pageSize" : 10,
				"list" : [ {
					"userId" : "2017062810073713315",
					"appSourceId" : null,
					"realName" : null,
					"comCode" : null,
					"comName" : null,
					"tel" : "18622919711",
					"staffSource" : 1,
					"cardVerify" : 0,
					"createTime" : "2017-06-28 10:07:37",
					"modifyTime" : "2017-06-28 10:07:37",
					"idNo" : null,
					"bankCode" : null,
					"bankName" : null,
					"cardNo" : null,
					"p2pBankName" : null,
					"p2pCardNo" : null,
					"p2pTel" : null,
					"p2pBankCode" : null,
					"distributeName" : "产品中心",
					"fundBankCards" : []
				}, {
					"userId" : "2017062810063554914",
					"appSourceId" : null,
					"realName" : null,
					"comCode" : null,
					"comName" : null,
					"tel" : "15222633905",
					"staffSource" : 1,
					"cardVerify" : 0,
					"createTime" : "2017-06-28 10:06:35",
					"modifyTime" : "2017-06-28 10:06:35",
					"idNo" : null,
					"bankCode" : null,
					"bankName" : null,
					"cardNo" : null,
					"p2pBankName" : null,
					"p2pCardNo" : null,
					"p2pTel" : null,
					"p2pBankCode" : null,
					"distributeName" : "产品中心",
					"fundBankCards" : []
				},

				{
					"userId" : "2017062216393051218",
					"appSourceId" : null,
					"realName" : null,
					"comCode" : null,
					"comName" : null,
					"tel" : "13921510319",
					"staffSource" : 1,
					"cardVerify" : 0,
					"createTime" : "2017-06-22 16:39:30",
					"modifyTime" : "2017-06-22 16:39:30",
					"idNo" : null,
					"bankCode" : null,
					"bankName" : null,
					"cardNo" : null,
					"p2pBankName" : null,
					"p2pCardNo" : null,
					"p2pTel" : null,
					"p2pBankCode" : null,
					"distributeName" : "产品中心",
					"fundBankCards" : []
				}, {
					"userId" : "2017062116355247417",
					"appSourceId" : null,
					"realName" : null,
					"comCode" : null,
					"comName" : null,
					"tel" : "18611687366",
					"staffSource" : 1,
					"cardVerify" : 0,
					"createTime" : "2017-06-21 16:35:52",
					"modifyTime" : "2017-06-21 16:35:52",
					"idNo" : null,
					"bankCode" : null,
					"bankName" : null,
					"cardNo" : null,
					"p2pBankName" : null,
					"p2pCardNo" : null,
					"p2pTel" : null,
					"p2pBankCode" : null,
					"distributeName" : "产品中心",
					"fundBankCards" : []
				}

				]
			}
		};
		
		var table = document.getElementsByTagName('table')[0];
		//alert(json.data.count);
		var list = json.data.list;
		for (var j = 0; j < list.length; j++) {
			var tr = document.createElement('tr');
			var temp = list[j];
			for ( var i in temp) {
				if (i == "userId" || i == "distributeName") {
					var th = document.createElement('th');
					tr.appendChild(th);
					th.innerHTML = temp[i];
				}
			}
			table.appendChild(tr);
		}
	</script>
</html>

大巨魔战将

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
将json 中的数据简单按照表格显示

var json = { data : { "count" : 4, "currPage" : 1, "totalPage" : 1, "pageSize" : 10, "list" : [ { "userId" : "2017062810073713315", "appSourceId" : null, "realNa
复制链接

扫一扫