Ves al contingut principal

Document Object Model (DOM)

El DOM (Document Object Model) és una interfície de programació d'aplicacions (API) que s'utilitza per a documents HTML i XML. Essencialment, és la representació estructurada i orientada a objectes de la pàgina web que permet als programes (principalment JavaScript) accedir al contingut, l'estructura i els estils del document i manipular-los de manera dinàmica.

El DOM com a Estructura d'Arbre

El DOM no és la pàgina HTML en si, sinó un model d'arbre jeràrquic creat pel navegador. Cada part de l'estructura del document (etiquetes, text, atributs) es converteix en un node.

  • Node Arrel: El document sencer (document)
  • Nodes d'Element: Representen les etiquetes HTML (p. ex., <body>, <div>, <p>)
  • Nodes d'Atribut: Representen els atributs de les etiquetes (p. ex., class="actiu")
  • Nodes de Text: Representen el text que hi ha dins dels elements.

Aquesta estructura d'arbre defineix les relacions pare-fill i germà entre els elements.

Funcionalitat Principal

La funció principal del DOM és fer que la pàgina web sigui interactiva:

  • Accés i Selecció: JavaScript pot trobar qualsevol element de la pàgina
  • Manipulació de Contingut: Permet llegir o modificar el contingut d'un element
  • Gestió d'Esdeveniments: Permet assignar funcions (listeners) als elements per reaccionar a les interaccions de l'usuari
  • Manipulació de l'Estructura: Permet afegir nous elements o eliminar-ne d'existents