ホームページ > 記事 > ウェブフロントエンド > jQuery を使用して DOM 要素を効率的に作成するにはどうすればよいですか?

jQuery を使用して DOM 要素を効率的に作成するにはどうすればよいですか?

How Can I Efficiently Create DOM Elements Using jQuery?

jQuery を使用した DOM 要素の作成

JavaScript コードを強化したいと考えており、jQuery の機能を利用して DOM 操作を簡素化することに興味があります。 .

jQuery は、お気づきのとおり、DOM 要素を作成する別の方法を提供します。 $.create("div") を使用します。ただし、このアプローチは jQuery のコア API の一部ではないため、常に信頼できるとは限りません。

より効率的で標準化されたソリューションについては、次の点を考慮してください。

this.$OuterDiv = $('<div></div>')
    .hide()
    .append($('<table></table>')
        .attr({ cellSpacing : 0 })
        .addClass("text")
    )
;

この簡潔なコードは、次のことを実現します。元の JavaScript と同じように、

を追加します。 $.append() で要素を作成し、そのプロパティを設定し、クラスを追加します。

ベンチマーク結果

さまざまな要素作成メソッドのパフォーマンスに関するベンチマークdocument.createElement が最も速いことが明らかになりました。ただし、最新バージョンの jQuery では、メソッド間の時間差は最小限です (例: 1000 要素あたり 3 ミリ秒)。

jQuery 1.7.2 用に更新

ベンチマークは jQuery 1.7.2 で更新されており、詳細については http://jsben.ch/#/ARUtz で入手できます。探索とクラウドソーシングの結果。

以上がjQuery を使用して DOM 要素を効率的に作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

続きを見る