jquery - 「壊れた」HTMLを使用したjQuery appendTo

Question

これは私のHTMLです：

<table id="mytable">

</table>

このコードを実行すると:

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

私は得る：

<table id="mytable">
<tr></tr>
</table>

jQuery の appendTo がタグを閉じないようにするにはどうすればよいですか?

Answer 1

できません。jQuery は、生の HTML の上のレイヤーである DOM で動作します。有効なノードのみで構成されます。

行に何かを追加する場合は、これを使用します。

var myRow = $('<tr />').appendTo('#mytable');
for( whatever ) {
    $('<td />').appendTo(myRow).text( 'this is my cell! woo!' );
}

Answer 2

上記のコメントで述べたように、いつでも文字列を作成して、その文字列を で使用できますappend()。

var myString = "<tr><td>Hello World!</td></tr>";
$('.inner').append(myString);

ただし、私はそれをお勧めしません。常に有効な要素を個別に作成してください。

Answer 3

そもそも jQuery がタグを閉じないようにする理由はありません。

を追加しようとしている場合は<tr>、タグ内にあるものをすべて追加してから、終了を追加します</tr>。代わりに clone メソッドを使用する必要があります。

HTML では:

<tr class="tr-template"></tr>

jQuery では:

$( 'tr-template' )
  .clone()
  .removeClass('tr-template')
  .html( 'whatever you want inside the tr' )
  .appendTo('#mytable');

Answer 4

私はあなたがこのようなことをもっとやりたいと思う：

var tableData = '<tr>';

tableData += "<td>One</td>";
tableData += "<td>Two</td>";
tableData += "<td>Three</td>";

tableData += "</tr>";

$('#mytable').html(tableData);

HTML の文字列を作成し、その文字列をテーブルに挿入します。