JQuery append dann aktualisieren Element id

Question

https://jsfiddle.net/codenoob/cavrnyv0/6/

bitte jsfiddle sehen.

Ich habe eine Schaltfläche, die eine neue Zeile an die Tabelle anhängen. dann möchte ich die ID für die neu hinzugefügte Zeile aktualisieren, damit jede Zeile eindeutig ist. Die Reihenfolge ist jedoch falsch.

zum Beispiel. Ich erwarte, dass immer

original 
newrow 1 
newrow 2 
newrow 3 

stattdessen bekomme ich

newrow 1 
newrow 2 
newrow 3 
original 

, wenn Sie Element überprüfen auf Entwickler-Tool. du wirst bemerken. Es wird nicht vor dem Original angefügt, aber es wird das Original in newrow1 umbenannt.

was habe ich falsch gemacht.

Answer 1

Sie müssen html() nicht zum Klonen verwenden - jquery kommt mit einer viel effizienteren Klonfunktion.

Sie möchten auch immer so viele Änderungen an einem DOM-Knoten vornehmen, wie Sie vor in das DOM einfügen können. In diesem Fall müssen Sie die ID des neuen Auswahlfelds festlegen, bevor Sie die neue Zeile anhängen. Der Grund dafür ist, dass nach dem Einfügen eines DOM-Knotens (z. B. auf der Seite) jede Änderung dazu führt, dass er neu gerendert wird - was ineffizient ist.

einen Blick auf diese aktualisierte Geige nehmen:

https://jsfiddle.net/cavrnyv0/8/