带有“残破” HTML的jQuery appendTo

Question

这是我的HTML：

<table id="mytable">

</table>

当我运行此代码时：

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

我得到：

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

如何避免jQuery的appendTo关闭标签？

Answer 1

你不能 jQuery适用于DOM，而DOM是原始HTML之上的一层。 它由只能有效的节点组成。

如果要将内容附加到该行，请使用以下命令：

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字符串，将该字符串注入表中。