JQuery text in html wrappen

[Thomas Darimont]

Hallo,

bei diesem Beispiel:
http://www.tutorials.de/forum/javascript-ajax/353522-html-listen-sortieren-mit-jquery.html

hätte ich auszugsweise drei Möglichkeiten text in ein html list item <li> zu wrappen:

$(this) ist in diesem Kontext ein <input type="text" .../>

1)
var newItemToAdd = "<li>" + $(this).val() + "</li>";
...

2)
var newItemToAdd = $("<li/>").html($(this).val());
...

3)
var emptyListItem = $("<li/>");
...
var newItemToAdd = emptyListItem.clone().html($(this).val());
...

welche Möglichkeit würdet ihr vorziehen und warum? Gibts hier noch andere (performantere) Lösungen?

Gruß Tom

 

[Sven Mintel]

Moin Thomas,

erst mal zu allen 3 Varianten:
du wrappst dort ja keinen Text, sondern HTML, text() wäre dort also das Mittel der Wahl(womit die 1.Variante wegfällt)


Ausgehend von dem, was ich in Sachen "gutes Programmieren" gelesen habe, sollte die 3. die sauberste Lösung sein, weil dort eine Kopie eines bestehenden Objektes verwendet wird, und nicht immer ein neues erzeugt werden muss.
Da dort wirklich "echt" geclont wird mittels DOM-Methode, sollte das am performantesten sein, denn das eigentliche Erstellen des Knotens dürfte das Nadelöhr sein.
Auf der anderen Seite hast du bei der 3. Variante immer ein Objekt mehr im Speicher, die 3. Variante sollte somit erst nach wiederholtem Einsatz Vorteile bringen, denke ich.
Aber wenn man es reel betrachtet, gehe ich nicht davon aus, dass bei der beabsichtigten Verwendung spürbare Performanceunterschiede feststellbar sein werden :suspekt:

BTW:
<promotion>
Vor einiger Zeit hatten wir mal ein ähnliches Thema(Listen sortieren mit jQuery), ich hatte da ein bissl rumgefummelt, herausgekommen ist eine Sortiermethode für alle erdenklichen Nodesets(hab ich erst gemerkt, als es fertig war ) nach beliebigen Kriterien.
Bei Interesse: http://www.tutorials.de/forum/javas...ery-sortieren-nach-vordefinierten-werten.html
</promotion>