Índice:
Vídeo: Curso de JavaScript | Aula 02 - "Olá Mundo" via JavaScript 2024
Em JavaScript, você pode exibir os tipos de nó e os valores dos nós usando o DOM HTML. Você também pode definir valores de propriedade de elementos dentro do DOM usando o objeto Element. Quando você usa JavaScript para definir as propriedades dos elementos DOM, os novos valores são refletidos em tempo real no documento HTML.
Alterar as propriedades dos elementos em um documento da Web para refletir-los instantaneamente no navegador, sem precisar atualizar ou recarregar a página da Web, é uma pedra angular do que costumava ser chamado de web 2. 0.
< ! --1 ->innerHTML
A propriedade mais importante de um elemento que você pode modificar através do DOM é a propriedade innerHTML.
A propriedade innerHTML de um elemento contém tudo entre o início e a etiqueta final do elemento. Por exemplo, no código a seguir, a propriedade innerHTML do elemento div contém um elemento p e seu filho do nó de texto:
Este é algum texto.
É muito comum na programação web criar elementos div divisáveis em seu documento HTML e, em seguida, usar a propriedade innerHTML para inserir dinamicamente HTML nos elementos.
Para recuperar e exibir o valor da propriedade innerHTML, você pode usar o seguinte código:
var getTheInner = document. corpo. primeiro filho. innerHTML; documento. escreva (getTheInner);
No código anterior, o valor que será emitido pelo documento. O método write () é
Este é um texto.
A configuração da propriedade innerHTML é feita da mesma maneira que você define a propriedade de qualquer objeto:
documento. corpo. primeiro filho. innerHTML = "Olá! ";
O resultado da execução do JavaScript anterior será que o elemento p e a frase do texto na marcação original serão substituídos pelas palavras "Olá! "O documento HTML original permanece inalterado, mas a representação DOM e a renderização da página da Web serão atualizados para refletir o novo valor. Como a representação DOM do documento HTML é o que o navegador exibe, a exibição de sua página da web também será atualizada.
Configurando atributos
Para definir o valor de um atributo HTML, você pode usar o método setAttribute ():
. corpo. primeiro filho. innerHTML. setAttribute ("class", "myclass");
O resultado da execução desta declaração é que o primeiro elemento filho do elemento do corpo receberá um novo atributo chamado "classe" com um valor de "myclass".
