JavaScript HTML DOM
Com o HTML DOM, o JavaScript pode acessar e alterar todos os elementos de um documento HTML.
O HTML DOM (modelo de objeto de documento)
Quando uma página da Web é carregada, o navegador cria um D ocument O bject M odelo da página.
O modelo HTML DOM é construído como uma árvore de objetos :
A árvore de objetos HTML DOM
Com o modelo de objeto, o JavaScript obtém todo o poder necessário para criar HTML dinâmico:
- JavaScript pode alterar todos os elementos HTML na página
- JavaScript pode alterar todos os atributos HTML na página
- JavaScript pode alterar todos os estilos CSS na página
- JavaScript pode remover elementos e atributos HTML existentes
- JavaScript pode adicionar novos elementos e atributos HTML
- JavaScript pode reagir a todos os eventos HTML existentes na página
- JavaScript pode criar novos eventos HTML na página
O que você vai aprender
Nos próximos capítulos deste tutorial você aprenderá:
- Como alterar o conteúdo de elementos HTML
- Como alterar o estilo (CSS) de elementos HTML
- Como reagir a eventos HTML DOM
- Como adicionar e excluir elementos HTML
O que é o DOM?
O DOM é um padrão W3C (World Wide Web Consortium).
O DOM define um padrão para acessar documentos:
"O Document Object Model (DOM) do W3C é uma plataforma e uma interface de linguagem neutra que permite que programas e scripts acessem e atualizem dinamicamente o conteúdo, a estrutura e o estilo de um documento."
O padrão W3C DOM é separado em 3 partes diferentes:
- Core DOM - modelo padrão para todos os tipos de documentos
- XML DOM - modelo padrão para documentos XML
- HTML DOM - modelo padrão para documentos HTML
O que é o DOM HTML?
O HTML DOM é um modelo de objeto padrão e uma interface de programação para HTML. Ele define:
- Os elementos HTML como objetos
- As propriedades de todos os elementos HTML
- Os métodos para acessar todos os elementos HTML
- Os eventos para todos os elementos HTML
Em outras palavras: O HTML DOM é um padrão de como obter, alterar, adicionar ou excluir elementos HTML.