 |
|
||||
Você está aqui: JavaScript ::: W3C DOM - (Wide Web Consortium) Document Object Model ::: Criação, modificação e exclusão de elementos |
Como criar novos elementos HTML usando o método createElement()Quantidade de visualizações: 2880 vezes |
|
Em algumas situações nós precisamos criar um novo elemento HTML dinamicamente, ou seja, depois que a página web já carregou. Para isso podemos usar o método document.createElement(). Ele cria o elemento cujo nome de tag fornecemos como uma string. Veja um exemplo completo:
<html>
<head>
<title>DOM da W3C</title>
</head>
<body>
<a href="javascript:criar_botao()">Criar um botão</a>
<script type="text/javascript">
function criar_botao(){
// vamos criar o botão dinamicamente
var btn = document.createElement("button");
// vamos definir o seu texto
btn.innerHTML = "Clique aqui";
// vamos adicionar o botão como último elemento do documento HTML
document.body.appendChild(btn);
}
</script>
</body>
</html>
Coloque este código em um documento HTML e abra-o em seu navegador web. Clique no link e veja um novo botão ser criado e exibido. Clique mais vezes e veja novos botões. No entanto, os botões não reagem ao clique. Não se preocupe. Em outras dicas no nosso site você aprenderá como adicionar eventos aos seus elementos HTML, mesmo em tempo de execução. |
 Link para compartilhar na Internet ou com seus amigos: |
Desafios, Exercícios e Algoritmos Resolvidos de JavaScript |
Veja mais Dicas e truques de JavaScript |
Dicas e truques de outras linguagens |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
|
1º lugar: Java |
