El DOM es un tipo especial de objeto que esquematiza las relaciones y interacciones entre los nodos de un documento web y que es creado por el navegador cada vez que interpreta una página web.
Cada etiqueta de un documento web es un nodo del mismo y puede ser interpretada a su vez como un objeto con propiedades definidas por los atributos, eventos y contenido de cada etiqueta.
En el modelo de objetos de un documento todos los nodos están relacionados entre si mediante jerarquías.[blockquote text=»Nodo = elemento (etiqueta) + atributos + eventos + texto» show_quote_icon=»no» background_color=»#045e67″ text_color=»#ffffff» width=»50″]
Que nos permite hacer el DOM
Mediante el DOM podemos acceder, modificar, crear, añadir o eliminar cualquier objeto ya sea el propio documento, etiquetas, atributos, eventos o estilos de cualquier etiqueta html, el css o incluso el propio javascript.
Lo resumimos como una combinación de uno de cada una de las 3 columnas a continuación:Encontrar
Modificar
Añadir
Crear
Eliminar
ReaccionarDocumentos
Elementos
Estilos
Atributos
Eventoshtml
css
javascript
Dónde y como visualizar el DOM
Todos los navegadores incorporan un kit de herramientas para desarrolladores desde dónde inspeccionar el código y entre muchos otros usar visualizar el DOM.
En la imagen de pantalla podemos ver un pequeño ejercicio de clase visto desde las herramientas para desarrolladores de un navegador Chrome.
En la imagen aparece una línea señalada y en el extremo inferior el camino «html > head > title» hasta llegar al elemento title y su contenidoEn esta entrada hemos resumido el concepto del DOM.
En futuras publicaciones hablaremos sobre como acceder al DOM y como modificar, crear y eliminar nodos.
Deja una respuesta