使用HTML显示表格

Question

我想使用HTML以表格格式显示以下内容。 您能否快速帮助使用HTML显示此内容。 请在下面的示例表内容找到。

Name | Count 
------------ 
X1 | 6 
X2 | 3 

Answer 1

阅读代码，如果你什么都不懂，请随时询问。

只是一个说明..你可以追加每行和单元.appendChild什么的。我之所以通过构建一个字符串并将其附加到最后，是因为DOM操作很繁琐，所以我宁愿只做一次，而不是每一行和单元格。明白了吗？

var jsonResponse = '[ { "name": "x16", "count": "x23" } ]'; 
 
var json = JSON.parse(jsonResponse); 
 

 
var output = ''; 
 
for (var i = 0; i < json.length; i++) { 
 
    output += '<tr><td>' + json[i].name + '</td><td>' + json[i].count + '</td></tr>'; 
 
} 
 

 
document.querySelector('tbody').innerHTML = output;

<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Count</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 

 
    </tbody> 
 
</table>