modificação HTML DOM
Modificar HTML = elementos de mudança, atributos, estilos e eventos.
elementos Editar HTML
Modificar HTML DOM significa muitos aspectos diferentes:
- Alterar o conteúdo HTML
- Alterar os estilos de CSS
- Alterar os atributos HTML
- Criar um novo elemento HTML
- Remover os elementos HTML existentes
- Evento Change (manipulador)
Nas seções seguintes, vamos estudar em profundidade o HTML DOM para modificar o método convencional.
Criar conteúdo HTML
A maneira mais fácil para alterar o conteúdo do elemento é usar a propriedade innerHTML.
O exemplo a seguir altera o conteúdo de um elemento HTML <p>:
Exemplos
<body>
<p id="p1">Hello World!</p>
<script>
document.getElementById("p1").innerHTML="New text!";
</script>
</body>
</html>
tente »
Vamos explicar-lhe os detalhes do exemplo nas secções seguintes. |
Alterar os estilos de HTML
Através do DOM HTML, você pode acessar os elementos HTML de estilo de objeto.
O exemplo a seguir para mudar um estilo de parágrafo HTML:
Exemplos
<body>
<p id="p2">Hello world!</p>
<script>
document.getElementById("p2").style.color="blue";
</script>
</body>
</html>
tente »
Criar um novo elemento HTML
Para adicionar um novo elemento ao DOM HTML, você deve primeiro criar o elemento (um nó de elemento) e, em seguida, anexá-lo aos elementos existentes.
Exemplos
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
<script>
var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);
var element=document.getElementById("d1");
element.appendChild(para);
</script>
tente »