javascript - 使用 JSON 和 Javascript 时表格未正确显示在行上

Question

for(var i=0;i<Result.length;i++){
    $('<tr>').appendTo('#resultstable');

    for(var j=0;j<tableID.length;j++){
        $('<td>' + Result[i][tableID[j]] + '</td>').appendTo('#resultstable');
                    }
        $('</tr>').appendTo('#resultstable');

当尝试显示来自 JSON 数据的表格时，它会正确显示标题(此处未显示)，但当我希望数据显示在新行中时，它不起作用。第一行数据显示正确，但第二行应显示的数据从第一行末尾继续显示。

在 HTML 中(加载时)，它显示为:

..Table headers..
<tbody>
<tr></tr>
</tbody>
<td>1</td>
...Rest of cell data is put in <td> tags...

Answer 1

这是因为

$('<tr>').appendTo('#resultstable');

创建<tr></tr> dom 元素并将其添加到 #resultstable表。

有了这个声明

$('<td>' + Result[i][tableID[j]] + '</td>').appendTo('#resultstable');

您没有在 <tr> 之后添加 html .您正在创建 td 标签并将其分配给 #resultstable table 。但 td 标签只能分配给 tr标签。

所以正确的语法将是。

for(var i=0;i<Result.length;i++){
var tr = $('<tr>').appendTo('#resultstable');

for(var j=0;j<tableID.length;j++) {
    $('<td>' + Result[i][tableID[j]] + '</td>').appendTo(tr);
}