2009-05-18 23 views
7

Phương pháp nào được ưu tiên để thêm hàng vào bảng?insertRow vs. appendChild

var tr = tbl.insertRow (-1);

hoặc

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

?

Trả lời

5

insertRow sẽ tốt hơn nhiều. Đó là supported bởi trình duyệt cấp A và ít trình duyệt hơn và API sạch hơn.

+0

Ngoài ra, các hàng không phải lúc nào cũng là con của bảng, điều này làm cho phương thức appendChild phức tạp hơn. –

+0

@rex: ý của bạn là gì? – erikkallen

+0

có thể là con của một số , thay vì một phần tử

. – Rob

3

insertRow có thể được lập luận là đáng tin cậy hơn vì đó là DOM [1].

Phương pháp appendChild là luôn nhanh hơn (mặc dù nhẹ) trên tất cả các trình duyệt thử nghiệm (IE6/7, FF3, Chrome2, Opera9) khi hoạt động ngoài của DOM, nhưng khi cố gắng sửa đổi bảng trong tài liệu (một nhiều nỗ lực chung) là chậm hơn đáng kể.

Nói cách khác: chắc chắn sử dụng insertRow.


Các xét nghiệm được thực hiện tại địa phương như vậy có thể không đáng tin cậy, xem nguồn ở đây: http://pastie.org/482023

0

Nếu bạn sử dụng phương pháp dom, một tr nên được nối vào một tbody, thead, hoặc yếu tố tfoot, và không cho một yếu tố bảng.

3

Tôi thấy đối số tốt cho insertRow, nhưng tôi thấy một bất lợi: insertRow chỉ có thể tạo một hàng trống mới, trong khi appendChild lấy một đối tượng hàng hiện có. Với appendChild, bạn có thể di chuyển các hàng xung quanh trong một bảng, di chuyển một hàng từ bảng này sang bảng khác, hoặc lấy một hàng ra khỏi bảng và sau đó đặt nó trở lại (rất tiện dụng cho các bảng được phân trang). Để làm điều tương tự với insertRow (và insertCell), bạn sẽ phải đóng gói nội dung, tạo các hàng và ô mới, sau đó thêm nội dung cũ vào các ô mới. Vụng về, và dường như kém hiệu quả hơn. Có cách nào duyên dáng hơn để làm điều này không? Một biến thể của insertRow mà lấy một đối tượng hàng hiện có sẽ là tốt đẹp.

Các vấn đề liên quan