JavaScript HTML DOM

A través del HTML DOM, JavaScript puede acceder y cambiar todos los elementos del documento HTML.

HTML DOM (Modelo de objeto de documento)

Cuando se carga una página web, el navegador crea el modelo de objeto de documento de la página (Document Object Model).

HTML DOM El modelo se estructura comoÁrbol de objetos:

Árbol DOM de objetos

Árbol DOM HTML

A través de este modelo de objetos, JavaScript obtiene todas las fuerzas necesarias para crear HTML dinámico:

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

¿Qué aprenderás?

En los siguientes capítulos de este tutorial, aprenderás:

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

¿Qué es DOM?

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

DOM define los estándares de acceso al documento:

“El W3C Document Object Model (DOM) es una interfaz independiente de plataforma y lenguaje que permite a los programas y scripts acceder y actualizar dinámicamente el contenido, la estructura y el estilo de los documentos.”

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

  • Core DOM - Modelo estándar para todos los tipos de documentos
  • XML DOM - Modelo estándar de documento XML
  • HTML DOM - Modelo estándar de documento HTML

¿Qué es HTML DOM?

HTML DOM es el estándar de HTMLObjetosModelos yInterfaz de programación. Define:

  • comoObjetosde los elementos HTML
  • de todos los elementos HTMLAtributos
  • para acceder a todos los elementos HTMLMétodos
  • de todos los elementos HTMLEventos

En otras palabras: HTML DOM es un estándar sobre cómo obtener, cambiar, agregar o eliminar elementos HTML.