javascript - insertRow 与 appendChild

Question

向表中添加行时首选哪种方法？

var tr = tbl.insertRow(-1);

或者

var tr = document.createElement('tr'); tbl.appendChild(tr);

?

Answer 1

insertRow会好很多。它由 A 级浏览器支持，它不那么冗长且 API 更简洁。

Answer 2

我看到了 insertRow 的好论据，但我发现了一个缺点：insertRow 只能创建一个新的空行，而 appendChild 采用现有的行对象。使用 appendChild，您可以在表中移动行，将行从一个表移动到另一个表，或者从表中取出一行，然后再将其放回（对于分页表非常方便）。要对 insertRow（和 insertCell）执行相同操作，您必须打包内容，创建新行和单元格，然后将旧内容添加到新单元格中。笨拙，而且似乎效率较低。有没有更优雅的方法来做到这一点？采用现有行对象的 insertRow 变体会很好。

Answer 3

insertRow可能被认为更可靠，因为它是 DOM[1]。

在 DOM之外运行时，该appendChild方法在所有测试的浏览器（IE6/7、FF3、Chrome2、Opera9）上始终更快（尽管略微），但在尝试修改文档中的表格（更常见的尝试）时，速度明显较慢。

换句话说：绝对使用insertRow.

---

这些测试是在本地进行的，因此可能不可靠，请参阅此处的来源：http: //pastie.org/482023

Answer 4

如果确实使用 dom 方法，则应将 tr 附加到 tbody、thead 或 tfoot 元素，而不是 table 元素。