Trabalhando com o conteúdo dos elementos de código com javascript

Video: Curso de HTML5 - 36 - Formulários com javascript - by Gustavo Guanabara

Em javascript, você pode exibir tipos de nós e valores de nó usando o DOM HTML. Você também pode definir valores de propriedade de elementos dentro do DOM usando o Elemento objeto. Quando você usa javascript para definir as propriedades de elementos DOM, os novos valores são refletidas em tempo real dentro do documento HTML.

Alterando as propriedades de elementos em um documento web, a fim de refleti-los instantaneamente no navegador, sem a necessidade de atualizar ou recarregar a página web, é uma pedra angular do que costumava ser chamado de web 2.0.

innerHTML

A propriedade mais importante de um elemento que pode ser modificado através do DOM é o innerHTML propriedade.

o innerHTML propriedade de um elemento contém tudo entre o início eo fim da marca do elemento. Por exemplo, no código a seguir, o innerHTML propriedade do div elemento contém um p elemento e seu filho nó de texto:

Este texto issome.

É muito comum em programação web para criar vazio div elementos no documento HTML e, em seguida, usar o innerHTML propriedade para inserir dinamicamente HTML nos elementos.

Para recuperar e exibir o valor da innerHTML propriedade, você pode usar o seguinte código:

var getTheInner = document.body.firstChild.innerHTML-document.write (getTheInner) -

No código anterior, o valor que será emitido pela document.write () método é

Video: Parte 2 - Criando um formulário para trabalhar com javascript

Este é um texto.
Video: Parte 9 - Para que serve o elemento "DIV" no HTML?

Definir o innerHTML propriedade é feito da mesma maneira que você definir a propriedade de qualquer objeto:

document.body.firstChild.innerHTML = “Hi there!” -

O resultado da execução do javascript anterior será que o p elemento e a sentença de texto na marcação original será substituído com as palavras “Olá!” O documento HTML original permanece inalterada, mas a representação DOM eo processamento da página web será atualizado para refletir o novo valor. Porque a representação DOM do documento HTML é o que o navegador exibe, a exibição da sua página web também será atualizado.

Definição de atributos

Para definir o valor de um atributo HTML, você pode usar o setAttribute () método:

document.body.firstChild.innerHTML.setAttribute ( “class”, “myclass”) -

O resultado da execução dessa afirmação é que o primeiro elemento filho do elemento corpo será dado um novo atributo chamado “classe” com um valor de “minha classe”.