InsertBefore e appendChild

Último post do ano! :)
Como prometido iremos falar sobre appendChild e insertBefore. Bom, já sabemos que appendChild e insertBefore, não é inclusão do elemento na estrutura html e sim a re-alocação. Os dois possuem apenas essa função, porém funcionam de forma diferentes.

insertBefore
Aloca um elemento no nó pai, anteriormente do elemento selecionado.

Sintaxe:
elemento.insertBefore(elemento_a_ser_alocado, elemento_guia);

Ex:
document.getElementById("meuElemento").insertBefore(document.createElement("DIV"), document.getElementById("elementGuia"));

No exemplo acima, o elemento DIV irá ser adicionado antes do elementoGuia.

Obs.:
Para essa alocação funcionar o elementoGuia, tem que ser filho (direto) do elemento (meuElemento), ou seja, não pode ter nenhum elemento entre elementoGuia e meuElemento.


appendChild
Aloca um elemento no último filho do elemento selecionado.

Sintaxe:
elemento.appendChild(elemento_a_ser_alocado);

Ex:
document.getElementById("meuElemento").appendChild(document.createElement("DIV"));

No exemplo acima adicionei a DIV após o último filho do elemento meuElemento, sendo assim, a DIV passa a ser o último filho do elemento meuElemento.

Considero esses conceitos de vitais importância para quem está iniciando o estudo de DHTML, ísso é só o início, com outros conceitos, você verá que é possível ser feito muito mais coisas interessantes com essas propriedades que falei hoje.

Então é isso, Um próspero ano novo à todos.

Fuiii...