Curso iMasters - Web Sites com Ajax - Capítulo 2

JavaScript

Método createElement

Mesmo aqueles que não dominam a língua inglesa conseguem compreender a função deste método, ou seja, criar um elemento, ou melhor dizendo, uma tag.

Imagine que você necessita criar um novo elemento em sua marcação HTML mas não há possibilidades de alterar a marcação já existente e o novo elemento deve ser inserido mediante algum evento ocorrido na página ou ocasionado pelo usuário.

O método createElement é a solução para esse problema.

Vejamos como utilizá-lo:


			// 1º 

			var conteudo = document.getElementById("box");

			// 2º 

			var newElement = document.createElement(what);

			// 3º 

			newElement.appendChild(document.createTextNode("Curso iMasters - Web Sites com Ajax"));

			// 4º 

			conteudo.appendChild(newElement);

Vejamos o exemplo em ação: método createElement.

Bom, no primeiro passo, referenciamos ao atributo ID de uma tag para que possamos utilizá-la como referência.

No segundo passo, definimos qual será a nova tag a ser criada. Observe que essa informação é oriunda de um parâmetro (what) da função em questão.

Ao novo elemento criado decidimos lhe fornecer um conteúdo utlizando para tal o appendChild e o createTextNode.

Finalizamos inserindo o novo elemento criado através do appenchild.

Assim, esse novo elemento foi criado como um novo filho do elemento referenciado na variável conteudo.