Exemplo
Criar um <button> elemento:
var btn = document.createElement("BUTTON");
O resultado será:
Tente você mesmo " elementos HTML frequentemente contém texto. Para criar um botão com texto que você também deve criar um nó de texto que você anexar ao <button> elemento:
Exemplo
Criar um botão com texto:
var btn = document.createElement("BUTTON");
// Create a <button> element
var t = document.createTextNode("CLICK ME");
// Create a text node
btn.appendChild(t);
// Append the text to <button>
document.body.appendChild(btn);
// Append <button> to <body>O resultado será:
Tente você mesmo " Mais "Try it Yourself" exemplos abaixo.
Definição e Uso
O createElement() método cria um elemento de nó com o nome especificado.
Dica: Use o createTextNode() método para criar um nó de texto.
Dica: Após o elemento é criado, use o elemento. appendChild() ou elemento. insertBefore() método para inseri-lo ao documento.
Suporte navegador
| Método | |||||
|---|---|---|---|---|---|
| createElement() | sim | sim | sim | sim | sim |
Sintaxe
document.createElement( nodename )Os valores dos parâmetros
| Parâmetro | Tipo | Descrição |
|---|---|---|
| nodename | String | Requeridos. O nome do elemento que deseja criar |
Detalhes técnicos
| Valor de retorno: | Um elemento de objeto, que representa o nó elemento criado |
|---|---|
| DOM Versão: | Núcleo Nível Objeto 1 Documento |
mais Exemplos
Exemplo
Criar um <p> elemento com algum texto e anexá-lo ao documento:
var para = document.createElement("P");
// Create a <p> element
var t =
document.createTextNode("This is a paragraph");
// Create a text node
para.appendChild(t);
// Append the text to <p>
document.body.appendChild(para);
// Append <p> to <body> Tente você mesmo " Exemplo
Criar um <p> elemento e anexá-lo a um <div> elemento:
var para = document.createElement("P");
// Create a <p> element
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 "