jquery - 带有“损坏” HTML 的 jQuery appendTo

Question

这是我的 HTML：

<table id="mytable">

</table>

当我运行此代码时：

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

我得到：

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

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

Answer 1

你不能。jQuery 在 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 关闭您的标签。

如果您尝试附加 a <tr>，然后添加标签内的任何内容，然后附加一个 close </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 字符串，将该字符串注入表中。