Javascript Can'；t从JSON创建动态表

如何使用JQuery从这些对象创建动态表

对象是数组类型并存储每列数据

我想要这样的桌子：

+--开始时间--开始分钟--开始月份--+
| 11          | 00           | 07         --|
| 03          | 03           | 03         --|

是的，但它的坏代码：（

函数GenerateHolidayTable（数据）{
变量名称、编号；
var HolidayTableHTML=''；
HolidayTableHTML+=“开始\月开始\日开始\小时开始\分钟结束\月结束\小时结束\分钟描述”；
$。每个（数据、函数（键、值）{
如果（键==“开始月份”）{
HolidayTableHTML+=''；
$.each（值、函数（键、值）{
HolidayTableHTML+=''+值+''；
});
}
..................................
否则如果（键==“说明”）{
$.each（值、函数（键、值）{
HolidayTableHTML+=''+值+''；
});
HolidayTableHTML+=''；
}
});
HolidayTableHTML+=''；
$（'#HolidayTable'）.append（HolidayTableHTML）；
}

您是否研究过javascript模板系统，例如

---

因为这样做相对容易。

您可以这样做：

假设所有三个（开始月、开始小时和开始分钟）的长度相等

var json=“{\'Start\'u Month\”：{\'1\：“1\”，“2\”，“3\”：“3\”，“Start\'u Minutes\”：{\'1\”：“10\”，“2\”：“20\”，“3\：“30\”，“Start\'u Hour\”：{\'1\：“01\”，“2\：“02\”，“3\：“03\”；
var jsonObj=JSON.parse（JSON）；
$.each（jsonObj.Start_小时，函数（idx，val）{
var行=”；
行+=“”+val+“”；
行+=“”+jsonObj.Start_分钟[idx]+“”；
行+=“”+jsonObj.Start_Month[idx]+“”；
行+=”；
$（“#数据”）。追加（行）；
})；

表格{
宽度：100%；
}
桌子
运输署，
th{
边框：2件浅蓝色实心；
}

开始时间
开始十分钟
每月开始

你试过编写代码吗？这不仅仅是糟糕的代码。如果我假设

$（“#HolidayTable”）

是一个

，然后你只需在其中添加另一个表。那么好吧。检查@anu的答案。它会让你走上正确的轨道。你的代码到底出了什么问题？所有元素都生成在一行中。我不知道如何从该数据结构中生成新行。嗯，这是有意义的。我错过了

开始时间

等的json结构二元数组+1

function GenerateHolidayTable(data) {
  var name, number;
  var HolidayTableHTML = '';
  HolidayTableHTML += '<table class="table"><tr><th>Start_Month</th><th>Start_Day</th><th>Start_Hour</th><th>Start_Min</th><th>End_Month</th><th>End_Day</th><th>End_Hour</th><th>End_Min</th> <th>Description</th></tr>';
  $.each(data, function(key, value) {
    if (key == "Start_Month") {
      HolidayTableHTML += '<tr>';
      $.each(value, function(key, value) {
        HolidayTableHTML += '<td>' + value + ' </td>';
      });
    }
    ..................................
    else if (key == "Description") {
      $.each(value, function(key, value) {
        HolidayTableHTML += '<td>' + value + ' </td>';
      });
      HolidayTableHTML += '</tr>';
    }
  });
  HolidayTableHTML += '</table>';
  $('#HolidayTable').append(HolidayTableHTML);
}