El Modelo de Objetos del Documento (DOM) es una interfaz independiente de la plataforma y el lenguaje que permite a los programas y scripts acceder y actualizar dinámicamente el contenido, la estructura y el estilo de un documento. El documento puede ser procesado posteriormente y los resultados de ese procesamiento pueden ser incorporados de nuevo a la página presentada.
El nivel 1 del DOM consta de dos partes:
El Nivel Core, que define la estructura fundamental del DOM.
El Nivel XML, que define cómo se puede utilizar el DOM con los documentos XML.
El nivel 2 del DOM consta de tres partes:
El nivel central, que define la estructura fundamental del DOM.
El nivel XML, que define cómo se puede utilizar el DOM con los documentos XML.
El Nivel de Eventos, que define cómo el DOM puede ser utilizado para manejar eventos.
El nivel 3 del DOM consta de cuatro partes:
El Nivel Core, que define la estructura fundamental del DOM.
El Nivel XML, que define cómo se puede utilizar el DOM con los documentos XML.
El Nivel de Eventos, que define cómo el DOM puede ser usado para manejar eventos.
El Nivel de Validación, que define cómo se puede utilizar el DOM para validar documentos.
¿Cómo se crea el DOM?
El Modelo de Objetos del Documento (DOM) es creado por el navegador cuando analiza el HTML en un árbol de documentos. El árbol DOM es entonces utilizado por el navegador para renderizar la página web.
El DOM es una estructura en forma de árbol, donde cada nodo representa un elemento HTML. El DOM puede ser navegado y manipulado por código JavaScript.
¿Qué son los nodos DOM?
Los nodos DOM (Document Object Model) son los objetos que representan los elementos de un documento HTML o XML. Estos objetos pueden ser manipulados para cambiar la estructura, el estilo o el contenido del documento.
Los nodos DOM suelen ser creados por el analizador del navegador cuando se carga el documento HTML o XML. También pueden ser creados dinámicamente por el código JavaScript.
Cada nodo DOM tiene propiedades y métodos que pueden ser usados para acceder y manipular su contenido. Por ejemplo, la propiedad parentNode de un nodo puede usarse para obtener una referencia a su nodo padre, y su propiedad childNodes puede usarse para obtener una lista de sus nodos hijos.
Los nodos del DOM pueden ser recorridos usando los métodos estándar de recorrido del árbol, como la búsqueda de profundidad y la de amplitud.
¿Qué son las propiedades DOM?
Hay varias formas de definir las propiedades DOM. En general, son características de un elemento en un documento que puede ser accedido y manipulado por JavaScript. Las propiedades DOM pueden dividirse a grandes rasgos en dos categorías:
1. las que representan el contenido del elemento (innerHTML, textContent, etc.), y
2. las que representan los atributos del elemento (id, className, href, etc.).
Además de estas dos categorías, también hay algunas propiedades diversas que no encajan realmente en ninguna de ellas (nodeName, nodeType, etc.).
1. Propiedades relacionadas con el contenido:
innerHTML - el contenido HTML de un elemento
textContent - el contenido de texto de un elemento (sin ninguna etiqueta HTML)
nodeName - el nombre de un elemento (por ejemplo, "DIV", "SPAN", etc.)
nodeType - el tipo de un elemento (por ejemplo, 1 para un elemento, 3 para un nodo de texto)
2. Propiedades relacionadas con los atributos:
Propiedades relacionadas con los atributos:
id - el atributo id del elemento
className - el atributo class del elemento
href - el atributo href del elemento (utilizado para los enlaces)
3. Propiedades varias:
parentNode - el elemento padre del elemento
childNodes - los elementos hijos del elemento
Como puedes ver, las propiedades DOM disponibles dependen del tipo de elemento con el que estés trabajando. Por ejemplo, si estás trabajando con un elemento enlace, tendrás acceso a la propiedad href, pero si estás trabajando con un elemento no enlace, no.
En general, puedes acceder a las propiedades DOM de un elemento usando el id del elemento (si tiene uno) o usando uno de los métodos disponibles en el objeto documento, como getElementById() o querySelector().
¿Qué es el DOM y su estructura?
El DOM (Document Object Model) es una interfaz independiente de la plataforma y el lenguaje que permite a los programas y scripts acceder y actualizar dinámicamente el contenido, la estructura y el estilo de un documento. El documento puede ser procesado posteriormente y los resultados de ese procesamiento pueden ser incorporados de nuevo a la página presentada.
El DOM no es un lenguaje de marcado, sino un conjunto de APIs que permiten a los programas acceder y manipular documentos HTML o XML. El DOM define una forma estándar de acceso y manipulación de documentos que puede ser utilizada por todos los lenguajes de programación.
El DOM está formado por un árbol de nodos, siendo el propio documento el nodo raíz. Cada nodo del árbol representa una parte del documento y puede tener nodos hijos. Se puede acceder a los nodos y manipularlos utilizando la API del DOM.
La estructura del DOM es tal que es posible navegar a través de los nodos del árbol, empezando por el nodo raíz y bajando a los nodos hijos. Esto hace posible acceder a cualquier parte del documento, y cambiar el documento añadiendo, eliminando o modificando nodos.