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 と同じことを実現します。
• .hide() で非表示にする。
• 要素を追加する$.append()、そのプロパティを設定し、クラスを追加します。

  ベンチマーク結果

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

  jQuery 1.7.2 用に更新

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