传入JSON数据自动生成表格

时间:2025-03-04 08:02:17
// EXTRACT VALUE FOR HTML HEADER. var converter=function (render) { //生成各个列 var col = []; for (var i = 0; i < render.length; i++) { for (var key in render[i]) { if (col.indexOf(key) === -1) { col.push(key); } } } console.log(col); //create a table var table = document.createElement("table"); var tr = table.insertRow(-1); // TABLE ROW. for (var i = 0; i < col.length; i++) { var th = document.createElement("th"); // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild(th); } // ADD JSON DATA TO THE TABLE AS ROWS. for (var i = 0; i < render.length; i++) { tr = table.insertRow(-1); for (var j = 0; j < col.length; j++) { var tabCell = tr.insertCell(-1); tabCell.innerHTML = render[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById("viewport"); divContainer.innerHTML = ""; divContainer.appendChild(table); return col.length; }