Los últimos tutoriales de desarrollo web
 

JavaScript HTML DOM


Con el DOM de HTML, JavaScript puede acceder y cambiar todos los elementos de un documento HTML.


El DOM HTML (Document Object Model)

Cuando se carga una página web, el navegador crea un modelo de objetos de documento de la página.

El modelo HTML DOM está construido como un árbol de objetos:

El árbol DOM de objetos HTML

árbol DOM HTML

Con el modelo de objetos, JavaScript recibe toda la energía que necesita para crear HTML dinámico:

  • JavaScript puede cambiar todos los elementos HTML en la página
  • JavaScript puede cambiar todos los atributos de HTML en la página
  • JavaScript puede cambiar todos los estilos CSS en la página
  • JavaScript puede eliminar elementos y atributos HTML existente
  • JavaScript puede agregar nuevos elementos y atributos HTML
  • JavaScript puede reaccionar a todos los eventos de HTML existentes en la página
  • JavaScript puede crear nuevos eventos en la página HTML

Lo que vas a aprender

En los próximos capítulos de este tutorial usted aprenderá:

  • Cómo cambiar el contenido de los elementos HTML
  • Cómo cambiar el estilo (CSS) de los elementos HTML
  • ¿Cómo reaccionar a HTML eventos DOM
  • Cómo agregar y eliminar elementos HTML

¿Qué es el DOM?

El DOM es una W3C (World Wide Web Consortium) estándar.

El DOM define un estándar para acceso a los mismos:

"El modelo de objetos de documento del W3C (DOM) es una interfaz de plataforma y lenguaje neutro que permite a los programas y scripts acceder y actualizar el contenido, la estructura y el estilo de un documento de forma dinámica."

El estándar W3C DOM se separa en 3 partes diferentes:

  • Núcleo del DOM - modelo estándar para todos los tipos de documentos
  • DOM XML - modelo estándar para documentos XML
  • HTML DOM - modelo estándar para documentos HTML

¿Qué es el DOM de HTML?

El HTML DOM es un modelo de objetos y la programación de interfaz estándar para el HTML. Se define:

  • Los elementos HTML comoobjetos
  • Laspropiedades de todos los elementos HTML
  • Losmétodos para acceder a todos los elementos HTML
  • Los eventos de todos los elementos HTML

En otras palabras:El DOM HTML es un estándar de cómo obtener, cambiar, añadir o eliminar elementos HTML.