Node.appendChild()

Il metodo Node.appendChild() aggiunge un nodo alla fine dell'elenco di figli di un nodo genitore specificato. Se il figlio dato è un riferimento a un nodo esistente nel documento, appendChild() lo sposta dalla sua posizione corrente alla nuova posizione (non è necessario rimuovere il nodo dal suo nodo padre prima di aggiungerlo ad un altro nodo).

Ciò significa che un nodo non può essere in due punti del documento contemporaneamente. Quindi se il nodo ha già un genitore, il nodo viene prima rimosso, quindi aggiunto alla nuova posizione. Il metodo Node.cloneNode() può essere usato per fare una copia del nodo prima di aggiungerlo sotto il nuovo genitore. Si noti che le copie eseguite con cloneNode non verranno automaticamente mantenute sincronizzate.

Se il figlio dato è un DocumentFragment, l'intero contenuto di DocumentFragment viene spostato nell'elenco secondario del nodo genitore specificato.

Sintassi

element.appendChild(aChild);

Parametri

aChild
Il nodo da aggiungere al nodo genitore dato (comunemente un elemento).

Valore di ritorno

Il valore restituito è il figlio aggiunto tranne quando il figlio dato è un DocumentFragment, nel qual caso viene restituito il DocumentFragment.

Appunti

Il concatenamento potrebbe non funzionare come previsto a causa di appendChild() che restituisce l'elemento figlio:

var aBlock = doc.createElement('block').appendChild(doc.createElement('b'));

Sets aBlock to <b></b> only, which is probably not what you want.

Esempio

// Crea un nuovo elemento di paragrafo e aggiungilo alla fine del corpo del documento
var p = document.createElement("p");
document.body.appendChild(p);

Specifiche

Specifica Stato Commento
DOM
The definition of 'Node.appendChild()' in that specification.
Living Standard Nessun cambiamento da Document Object Model (DOM) Level 3 Core Specification.
Document Object Model (DOM) Level 3 Core Specification
The definition of 'Node.appendChild()' in that specification.
Obsolete Nessun cambiamento da Document Object Model (DOM) Level 2 Core Specification.
Document Object Model (DOM) Level 2 Core Specification
The definition of 'Node.appendChild()' in that specification.
Obsolete Nessun cambiamento da Document Object Model (DOM) Level 1 Specification.
Document Object Model (DOM) Level 1 Specification
The definition of 'Node.appendChild()' in that specification.
Obsolete Definizione inziale.

Compatibilità con i browser

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
appendChildChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 5Opera Full support 7Safari Full support 1.1WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support 1.0

Legend

Full support  
Full support

Vedi anche