jquery - 如何创建 HTML 表格的 tr 和 th

Question

我正在尝试使用 jquery 制作一个应该具有以下 HTML 的表格

<table id="tblProviders">
    <thead>
        <tr>
            <th>Name</th>
            <th>Time (Sec.)</th>
        </tr>
    </thead>
</table>

我有一个字符串columnKeys 数组，其中包含第 元素的列名称。我已经有一个表格元素。我想使用 jquery append thead 和其余元素。

<table id="tblProviders">

</table> 

我尝试遵循 jquery 但没有成功。有人可以帮我构建表格元素吗？

var tr = $("#tblProviders").append("tr");
for(var i =0; i< columnKeys.length; i++)
{
    var th = $("#tblProviders").append("th");      // TABLE HEADER.
    th.innerHTML = columnKeys[i];
    tr.append(th);
}

Answer 1

试试这个代码。

var $toAttach = $("<thead><tr></tr></thead>");

for (var i = 0; i < columnKeys.length; i++) {
  var $thead = $("<th></th>");
  $thead.text(columnKeys[i]);
  $toAttach.find("tr").append($thead);
}

$("#tblProviders").append($toAttach);

根据你的代码，我认为你做的append()错误并且混合了JQuery和JavaScript，这可能会导致一些困惑，因为JavaScript在某些JQuery对象上无法按预期工作。