如何让一个json文件显示在表格里【实现代码】

2019-11-20 10:07:36

字体：大中小

来源：转载

供稿：网友

<body>//首先得把架子搭起来<table id = "tb" border="1"> <tr></tr> <tr></tr></table>//js部分<script>//简单的json内容var json = {"姓名":"张三","年龄":"26","性别":"男"};//获取trvar tr = document.getElementsByTagName('tr');//tr1和tr2下面会用到，但是要先声明，给一个空值var tr1 = '';var tr2 = '';//用for in来进行遍历，k是键，json[k]是值for(var k in json){ tr1+='<th>'+k+'</th>'; tr2+='<td>'+json[k]+'</td>';}//tr1里放的是键，也就是姓名，年龄，性别，然后把这些信息放到第一个tr里tr[0].innerHTML = tr1;//tr2里放的是值，也就是张三，26，男，把这些信息放到第二个tr里tr[1].innerHTML = tr2;</script>

以前想着如何才能把json的内容动态放到表格里面呢？有时候面试会被问到，当然面试时问的是用ajax如何办到。但是我这里就写个简单的demo，现有的json放到表格里。这个demo我做了好几遍，虽然每次放到表格里，但是样子都很古怪，有可能是一个竖排例如这样

姓名

张三

年龄

性别

男

又有可能是这样

姓名

年龄

性别

张三

男