HTML DOM appendChild() Method

Esempio

Aggiungere un elemento in un elenco:

var node = document.createElement("LI");                 // Create a <li> node
var textnode = document.createTextNode("Water");         // Create a text node
node.appendChild(textnode);                              // Append the text to <li>
document.getElementById("myList").appendChild(node);     // Append <li> to <ul> with id="myList"

Prima di aggiungere:

Coffee
Tea

Dopo aggiungendo:

Coffee
Tea
Water

Prova tu stesso "

Più "Try it Yourself" esempi di seguito.

Definizione e l'utilizzo

appendChild() metodo aggiunge un nodo come l'ultimo figlio di un nodo.

Suggerimento: se si desidera creare un nuovo paragrafo, con testo, ricordarsi di creare il testo come un nodo di testo, che si aggiunge al paragrafo, quindi aggiungere il paragrafo al documento.

È inoltre possibile utilizzare questo metodo per spostare un elemento da un elemento ad un altro (See "More Examples") .

Suggerimento: Utilizzare insertBefore() metodo per inserire un nuovo nodo figlio prima di una, già esistente, nodo figlio specificato.

Supporto browser

I numeri nella tabella indicano la prima versione del browser che supporta pienamente il metodo.

Metodo
appendChild()	sì	sì	sì	sì	sì

Sintassi

node .appendChild( node )

valori dei parametri

Parametro	Tipo	Descrizione
node	Node object	Necessario. L'oggetto nodo che si desidera aggiungere

Dettagli tecnici

Valore di ritorno:	Un oggetto Node, che rappresenta il nodo aggiunto
DOM Version	Nucleo Livello 1 Nodo Oggetto

Altri esempi

Esempio

Spostare un elemento della lista da una lista all'altra:

var node = document.getElementById("myList2").lastChild;
document.getElementById("myList1").appendChild(node);

Prima di aggiungere:

Coffee
Tea

Water
Milk

Dopo aggiungendo:

Coffee
Tea
Milk

Water

Prova tu stesso "

Esempio

Creare un <p> elemento e aggiungerlo ad un <div> elemento:

var para = document.createElement("P");                       // Create a <p> node
var t = document.createTextNode("This is a paragraph.");      // Create a text node
para.appendChild(t);                                          // Append the text to <p>
document.getElementById("myDIV").appendChild(para);           // Append <p> to <div> with id="myDIV"

Prova tu stesso "

Esempio

Creare un <p> elemento con un testo e aggiungerlo alla fine del corpo del documento:

var x = document.createElement("P");                        // Create a <p> node
var t = document.createTextNode("This is a paragraph.");    // Create a text node
x.appendChild(t);                                           // Append the text to <p>
document.body.appendChild(x);                               // Append <p> to <body>

Prova tu stesso "