javascript 数组 遍历成table

Question

如果将一个多维数组遍历成一个table？

`var arr = [{id: "1",name:"11",comment:"1"},{id: "2",name:"22",comment:"22"},{id: "333",name:"333",comment:"333"}];

最终效果是如下图

Answer 1

这真的不是我想说的。`// 首先，我们将你的对象 arrvar len = arr.length;for(var i = 0 ;i < len;i++){&nbsp; &nbsp; for(var key in arr[i]){&nbsp; &nbsp; &nbsp; &nbsp; console.log(key);&nbsp; &nbsp; &nbsp; &nbsp; console.log(arr[i][key]);&nbsp; &nbsp; }&nbsp; &nbsp;&nbsp;}`试一试？

Answer 2

给你写个&nbsp;var arr = [{id: "1",name:"11",comment:"1"},{id: "2",name:"22",comment:"22"},{id: "333",name:"333",comment:"333"}];var str=`&nbsp; &nbsp; &nbsp; &nbsp; <table border="4">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <thead>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <tr>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <th>id</th><th>name</th><th>comment</th></tr>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </thead>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <tbody>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ${&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; arr.map(o => {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return `<tr>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td>${o.id}</td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td>${o.name}</td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td>${o.comment}</td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </tr>`&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }).join('')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </tbody>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</table>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;`document.querySelector('#table-wrap').innerHTML=str实际效果