<tr>タグを使用せずにテーブルに行を追加する方法はありますか？

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。

;（第2のappend()の後に、そしてhtml()の後に）セミコロンがないことに非常に注意してください。

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

Answer 2

$("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オブジェクト内にカプセル化されます。属性とコンテンツは、$（）メソッドに渡される2番目の引数（オブジェクトリテラル）で定義されています;

Answer 3

1.4+構文を使用していてもきれいな方法があります：あなたがこれを行うことができますjQueryので