Javascript：将行从 HTML 动态添加到 IE 中的表时出现问题答案

【问题标题】：Javascript: issue when dynamically adding a row from its HTML to a table in IEJavascript：将行从 HTML 动态添加到 IE 中的表时出现问题
【发布时间】：2010-02-24 20:39:32
【问题描述】：

我查看了一些其他问题，例如 this one，但它们没有解决这个特定问题：

当我在 IE (8) 中运行这段代码时：

$("<tr><td>1</td><td>A</td></tr>").appendTo("#myTable tbody");

我最终将这个 HTML 添加到表格的正文中：

<TR>
1</TD><//TD>
<TD>
</TD>
A</TD><//TD></TR><//TR>
</TR>

有什么想法吗？提前致谢。

【问题讨论】：

我不知道 jquery 是如何实现这一点的，但如果你不能让它与这个特定的结构一起工作，这可能会有所帮助：stackoverflow.com/questions/2324782/…
仅供参考在 IE7 和 FF3.5 中运行良好

标签： javascript jquery html internet-explorer

【解决方案1】：

您尝试做的事情真的很难正确地做。这是因为<TR> 元素在<TABLE> 的范围之外毫无意义。虽然解释你的意图对我们人类来说很容易，但很可能 jQuery 不够聪明，无法做到这一点，并且做正确的事情。

正确的做法是：

var tbody = document.getElementById('myTable').getElementsByTagName('tbody')[0];
var row = document.createElement('tr');
tbody.appendChild(row);
var cell = document.createElement('td');
cell.innerHTML = '1';
row.appendChild(cell);
cell = document.createElement('td');
cell.innerHTML = 'A';
row.appendChild(cell);

现在你的问题中的代码确实更紧凑，但这并不意味着 jQuery 需要在幕后做更少的工作才能真正达到预期的结果。

【讨论】：

【解决方案2】：

试试

$("#myTable tbody").append("<tr><td>1</td><td>A</td></tr>");

它是一样的，但它在 jQuery 中做的事情完全不同

【讨论】：