HTML DOM appendChild() Method

Exemplo

Acrescentando um item em uma lista:

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"

Antes de acrescentar:

Coffee
Tea

Depois de acrescentar:

Coffee
Tea
Water

Tente você mesmo "

Mais "Try it Yourself" exemplos abaixo.

Definição e Uso

O appendChild() método acrescenta um nó como o último filho de um nó.

Dica: Se você quiser criar um novo parágrafo, com texto, lembre-se para criar o texto como um nó de texto que você acrescentar ao parágrafo, em seguida, acrescentar o parágrafo para o documento.

Você também pode usar esse método para mover um elemento de um elemento para outro (See "More Examples") .

Dica: Use o insertBefore() método para inserir um novo nó filho antes, um nó especificado, existente criança.

Suporte navegador

Os números na tabela especificar a primeira versão do navegador que suporta totalmente o método.

Método
appendChild()	sim	sim	sim	sim	sim

Sintaxe

node .appendChild( node )

Os valores dos parâmetros

Parâmetro	Tipo	Descrição
node	Node object	Requeridos. O objeto nó que você deseja anexar

Detalhes técnicos

Valor de retorno:	Um objecto do nó, que representa o nó anexado
DOM Versão	Núcleo Nível Objeto 1 Node

mais Exemplos

Exemplo

Mover um item da lista de uma lista para outra:

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

Antes de acrescentar:

Coffee
Tea

Water
Milk

Depois de acrescentar:

Coffee
Tea
Milk

Water

Tente você mesmo "

Exemplo

Criar um <p> elemento e anexá-lo a um <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"

Tente você mesmo "

Exemplo

Criar um <p> elemento com algum texto e acrescentá-lo ao final do corpo do 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>

Tente você mesmo "