createElement Variable wiederholt mit appendChild verwenden

[BluB0HR]

Auf ein neues. Das Troubleshooting war kein Spaß und ich versteh auch nicht, warum folgendes nicht auf beide Arten funktioniert.

Funktioniert nicht: Erzeugt nur eine neue leere options in einem select-tag

function addselect() {
var newopt = document.createElement("option");
document.getElementById("mydiv").lastChild.appendChild(newopt);
document.getElementById("mydiv").lastChild.appendChild(newopt);
}

Funktioniert wie gewollt, 2 neue options werden erzeugt

function addselect() {
document.getElementById("mydiv").lastChild.appendChild(document.createElement("option"));
document.getElementById("mydiv").lastChild.appendChild(document.createElement("option"));
}

Ich verwende jetzt einfach letztere function, aber rein aus Verständnis würde ich gern wissen, warum ich die Variable in der ersten function nicht zweimal verwenden kann. Zumindest scheint es der Fall zu sein, denn ein appendChild funtioniert. Manchmal versteh ich dieses Javascript echt nicht.

 

[Sven Mintel]

Moin,

du kannst diese Variable 2x verwenden, es sieht nur so aus, als würde der 2. Versuch fehlschlagen.

Was wirklich passiert, ist, dass beim 2.mal der Knoten, der beim 1. mal eingefügt wurde, wieder von seiner Position entfernt wurde, entsprechend der Spezifikation:

appendChild
Adds the node newChild to the end of the list of children of this node. If the newChild is already in the tree, it is first removed.

Du könntest auch einen clone dieses Knotens einfügen, evtl. ist das für dein Vorhaben praktischer:

document.getElementById("mydiv").lastChild.appendChild(newopt.cloneNode(true));