用Javascript对象动态构建HTML表

Dynamically Building HTML Table with Javascript Object

本文关键字：HTML 构建 动态 Javascript 对象      更新时间：2023-09-26

这里我循环遍历一个对象，检索键：值对，并将它们放在表中

obj = clickedRecord.toJSON(); //gets record from 
                              //separate table and converts to JSON format
var array=[];
for(key in obj) {
   if(obj.hasOwnProperty(key)) {
      array.push(
         '<table id="myTable">' +
             '<tr>' +
               '<td>' + key + '</td>' +
               '<td>' + obj[key] + '</td>' +
             '<tr>' +
         '</table>''
      );
   }
}

其输出为：

ID 100
,
Name Billy
,
Address 525 Park Lane
,

有没有一种更干净的方法可以使用javascript对象动态构建表，并从返回的数据中省略逗号？

类似这样的东西：

   var table = document.createElement('TABLE');
   table.setAttribute("id", "myTable");
   for(key in obj) {
       var tr = document.createElement('TR');
       table.appendChild(tr);
       var td = document.createElement('TD');           
       td.appendChild(document.createTextNode(key));
       tr.appendChild(td);
       var td2 = document.createElement('TD');           
       td2.appendChild(document.createTextNode(obj[key]));
       tr.appendChild(td2);
   }
相关文章：