Question

我知道如何使用jquery将新行附加到表中。最简单的方法是使用标记<tr>：

function insertRow(data, reportNumber) {  
    var guid = $(data).find('ID').text();  
    var portId = $(data).find('PortID').text();  
    var status = $(data).find('Status').text();  
    $('#gvwCashRegisterList').append(  
            "<tr class=\"cashRegisterRow\"><td><input type=\"checkbox\" value=\"" + guid +   "\"/></td><td>" + new Date().toLocaleString() + "</td><td>" + guid + "</td>  <td></td><td>" + reportNumber + "</td><td>" + portId + "</td><td>" + status + "</td><td><a   href=\"CashRegisterList.aspx\">Select</a></td></tr>"  
        );  
}

如果不使用标签<tr>，有没有任何已知方法可以做到这一点？例如：jQuery函数，插件或库？

Answer 1

只有<tr>标记可以在HTML中生成表格行 - 没有其他方法可以使用表格中的其他标记复制其行为。

但是有一种更简洁的方法可以追加表格行：

$("table tbody").append(
    $("<tr>") // create new tr element
        .attr("class","newTR") // set its class
        .append(
            $("<td>") // create a new td element within the tr
                .html("But this is new!") // set its content
        )
);

Example

请注意缺少分号;（例如，在第二个append()之后，以及html()）。

Answer 2

使用1.4+语法有一种更清晰的方法：

$("table").append(
    // create new tr element
    $("<tr></tr>", {
        "class": "newClass", // set its class
        html: $("<td></td>", { // create a td element within the tr
          text: "Table cell" // add text content
        })
    });
});

现在一切都整齐地封装在新的tr对象中。属性和内容在传递给$（）方法的第二个参数（对象文字）中定义;）

Answer 3

在jQuery中你可以这样做：

$('<tr class="myclass" />')
    .append($('<td />').html('whatever here'))
    .appendTo('table');

如何在不使用标记的情况下将行附加到表中？

3 个答案: