2009-05-18 15 views
7

テーブルに行を追加するにはどちらの方法をお勧めしますか?insertRowとappendChildの比較

var tr = tbl.insertRow(-1);

又は

VAR TR =のdocument.createElement( 'TR'); tbl.appendChild(tr);

答えて

5

insertRowはもっと良いでしょう。グレードAのブラウザではsupportedであり、あまり冗長ではなく、よりクリーンなAPIです。

+0

また、行は常にテーブルの子ではなく、appendChildメソッドが複雑になります。 –

+0

@rex:どういう意味ですか? – erikkallen

+0

は、

要素ではなく、の子要素になります。 – Rob

3

insertRow DOM [1]なので、より信頼できると主張できます。

appendChild方法がより多くの(DOMの外を操作するとき、すべてのテストのブラウザ(IE6/7、FF3、Chrome2、Opera9)間で(とはいえわずかに)一貫して高速ですが、ドキュメント内のテーブルを変更しようとしたとき一般的な努力)それはかなり遅いです。

つまり、間違いなくinsertRowを使用してください。


これらのテストはそれほど信頼性ではないかもしれないが、ここではソースを参照してくださいローカルで実行された:、http://pastie.org/482023

0

を使用すると、DOMメソッドを使用する場合、trはTBODY、THEAD、またはTFOOT要素に追加する必要がありますテーブル要素には適用されません。

3

insertRowには良い議論がありますが、insertRowは新しい空の行だけを作成できますが、appendChildは既存の行オブジェクトを取ります。 appendChildを使用すると、テーブル内で行を移動したり、あるテーブルから別のテーブルに行を移動したり、テーブルから行を取り出して後で戻したりすることができます(ページテーブルでは非常に便利です)。 insertRow(およびinsertCell)を使用して同じことを行うには、コンテンツをパッケージ化し、新しい行とセルを作成してから、古いセルを新しいセルに追加する必要があります。不器用で、一見効率の低いようです。これを行うより優雅な方法がありますか?既存の行オブジェクトを受け取るinsertRowの変種が良いでしょう。

関連する問題