jQuery 我可以在这个 javascript 函数中使用 append/appendTo

Question

我创建了一个函数，它成功地附加了一个带有行/单元格的表格，并从一个数组中填充它们。问题是它们被附加到表格的顶部。

这样做是因为var row = tbody.insertRow(r);...I think/hope.

下面链接中要查看的函数是appendTable(id)

这是附加到顶部的工作示例：http://jsfiddle.net/JEAkX/4/

我在想这样的事情会起作用：var row = insertRow(r).appendTo('tbody>tr:last'); 但是它只是破坏了功能。

我还在同一行尝试了.append() 和.appendTo() 的许多不同组合，但没有成功。 作为最后的努力，我尝试了在线cell.innerHTML = "<input type='text' size='1' value='" + subset[i++] + "' />" 的变化，但我相信到那时位置已经确定。

这是从示例中提取的函数：

function appendTable(id)
{
    var tbody = document.getElementById(id).getElementsByTagName("tbody")[0];
    var i = 0;
    for (var r = 0; r < 2; r++) {
        var row = tbody.insertRow(r);
        for (var c = 0; c < 4; c++) {
            var cell = row.insertCell(c);
            cell.innerHTML = "<input type='text' size='1' value='" + subset[i++] + "' />"
        }
    }
}

一方面我没有尝试（不成功）insertAfter，但读到我无法在页面加载时不存在的东西上使用它。

Answer 1

为该行创建字符串并将其附加到 tbody 是可行的，从文档来看，它看起来像是 appendTo() 的预期用途。

function appendTable(id)
{
    var tbody = document.getElementById(id).getElementsByTagName("tbody")[0];
    var i = 0;
    for (var r = 0; r < 2; r++) {
        var row = tbody.insertRow(r);
        var rowtext = '<tr>';
        for (var c = 0; c < 4; c++) {
            rowtext += '<td><input type="text" size="1" value="x" /></td>';
        }
        rowtext += '</tr>';
        $(rowtext).appendTo(tbody);
    }
}

Answer 2

insertRow 在指定索引处添加一行。

当该参数（代码中的r）为零时，它会将行添加到表的顶部。 要将它们添加到末尾，请使用表格的当前长度作为起点：

function appendTable(id)
{
    var tbody = document.getElementById(id).getElementsByTagName("tbody")[0];
    var length = tbody.rows.length;
    for (var r = length; r < length + 1; r++) {
        var row = tbody.insertRow(r);
        // etc.
    }
}