Aggiungi a innerHTML senza distruggere il contenuto del modulo

Question

Ho un modulo generato tramite ajax basato su un uploader multi-file (swfupload). Aggiunge ulteriori elementi del modulo a un determinato elemento dom al completamento di ogni file caricato. Questo mi dà quindi un problema. Se ho selezionato 5 file da caricare, il primo file genererà un modulo in cui inizierò a inserire i dati, tuttavia, quando il secondo file è completato, cancella i dati inseriti precedentemente negli elementi del modulo e aggiunge anche i 2 ° elementi del modulo .

credo che questo sia perché im utilizzando:

document.getElementById('test').innerHTML = document.getElementById('test').innerHTML + newformelements; 

Penso che fare quanto sopra non mantiene alcun i dati inseriti nei moduli, solo il codice HTML stesso.

Quindi, come posso aggiungere a questo elemento senza distruggere ciò che è già stato inserito nei campi? Il numero di possibili bambini è dinamico basato sul multi-uploader.

Answer 1

Sei aperto all'utilizzo di jquery? Se sì allora si può facilmente fare qualcosa di simile

$("#divid").append("html you want to append"); 

Answer 2

Utilizzare la manipolazione DOM, in questo caso: Node.appendChild^[docs].

innerHTMLsempre distruggere e ricreare gli elementi.

Answer 3

Creare un nuovo elemento, impostarne il innerHTML, quindi aggiungerlo alla fine dei figli dei moduli.