Erstellen von DOM-Elementen mit jQuery

In Ihrem Wunsch, Ihren JavaScript-Code zu verbessern, möchten Sie die Funktionalität von jQuery nutzen, um die DOM-Manipulation zu vereinfachen .

jQuery bietet alternative Möglichkeiten zum Erstellen von DOM-Elementen, wie Sie bei $.create("div") bemerkt haben. Dieser Ansatz ist jedoch nicht Teil der Kern-API von jQuery und möglicherweise nicht immer zuverlässig.

Bedenken Sie für eine effizientere und standardisierte Lösung Folgendes:

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

Dieser prägnante Code erreicht dasselbe wie Ihr ursprüngliches JavaScript durch:

• Erstellen eines
  -Elements mit $('

  ).
• Verstecken mit .hide().
• Anhängen eines -Elements mit $.append(), Festlegen seiner Eigenschaften und Hinzufügen einer Klasse.

  Benchmarking-Ergebnisse

  In Bezug auf die Leistung verschiedener Elementerstellungsmethoden ergab ein Benchmark, dass document.createElement am schnellsten ist. Allerdings sind die Zeitunterschiede zwischen den Methoden in modernen Versionen von jQuery minimal (z. B. 3 Millisekunden pro tausend Elemente).

  Aktualisiert für jQuery 1.7.2

  Die Benchmark wurde mit jQuery 1.7.2 aktualisiert und ist unter http://jsben.ch/#/ARUtz für weitere Untersuchungen und Crowdsourcing-Ergebnisse verfügbar.