Ing. Telemática

La creación del Document Object Model o DOM es
una de las innovaciones que más ha influido en el
desarrollo de las páginas web dinámicas y de las
aplicaciones web más complejas.
DOM se diseñó originalmente para manipular de
forma sencilla los documentos XML.
A pesar de sus orígenes, DOM se ha convertido en
una utilidad disponible para la mayoría de lenguajes
de programación (Java, PHP,JavaScript) y cuyas
únicas diferencias se encuentran en la forma de
implementarlo.

Acorde al W3C el Modelo de Objetos del
Documento es una interfaz de programación de
aplicaciones (API) para documentos validos HTML y
bien construidos XML. Define la estructura lógica de
los documentos y el modo en que se accede y
manipula.
El DOM permite un acceso a la estructura de una
página HTMLmediante el mapeo de los elementos
de esta página en un árbol de nodos. Cada
elemento se convierte en un nodo y cada porción de
texto en un nodo de texto.




Página sencilla


Esta página es
muy sencilla
con negritas




Como puede verse un elemento strong se
encuentra localizado dentro de un elemento p del
HTML, convirtiéndose en un nodo hijo, o
simplemente hijo del nodo p, demanera similar p es
el nodo padre. Los nodos div y strong son hijos del
mismo padre (hijos del nodo p), llamándose nodos
hermanos o simplemente hermanos.
Es importante comprender la diferencia entre
elementos y nodos de textos. Los elementos
comúnmente son asociados a las etiquetas. En
HTML todas las etiquetas son elementos, tales
como p, img y div por lo que tienen atributos y
contienesnodos hijos. Sin embargo, los nodos de
textos no poseen atributos e hijos.

Document
XHTML

Element
HEAD

Element
BODY

Element
Title

Element
P

Text
Página Sencilla

Text
Esta página es

Element
strong

Element
Div

Text
muy sencilla

Text
con negrillas

La raíz del árbol de nodos de cualquier página
XHTML siempre es un nodo especial denominado"Documento".

La conversión de etiquetas en nodos se realiza de
forma jerárquica. De esta forma, del nodo raíz
solamente pueden derivar los nodos HEAD y
BODY.
La transformación de las etiquetas XHTML
habituales genera dos nodos: el primero es el nodo
de tipo "Element" (correspondiente a la propia
etiqueta XHTML) y el segundo es un nodo de tipo
"Text" que contiene el texto encerrado por esaetiqueta XHTML.

La especificación completa de DOM define 12 tipos
de nodos, aunque las páginas XHTML habituales se
pueden manipular manejando solamente cuatro o
cinco tipos de nodos:
• Document, nodo raíz del que derivan todos los
demás nodos del árbol.
• Element, representa cada una de las etiquetas
XHTML. Se trata del único nodo que puede
contener atributos y el único del que puedenderivar otros nodos.

• Attr, se define un nodo de este tipo para
representar cada uno de los atributos de las
etiquetas XHTML, es decir, uno por cada par
atributo=valor.

• Text, nodo que contiene el texto encerrado por
una etiqueta XHTML.
• Comment, representa los comentarios incluidos
en la página XHTML.

Los otros tipos de nodos existentes que no se van a
considerar son DocumentType,CDataSection,
DocumentFragment, Entity, EntityReference,
ProcessingInstruction y Notation.

Una vez construido automáticamente el árbol
completo de nodos DOM, ya es posible utilizar las
funciones DOM para acceder de forma directa a
cualquier nodo del árbol.

Como acceder a un nodo del árbol es equivalente a
acceder a "un trozo" de la página, una vez
construido el árbol, ya es posiblemanipular de
forma sencilla la página: acceder al valor de un
elemento, establecer el valor de un elemento, mover
un elemento de la página, crear y añadir nuevos
elementos, etc.

DOM proporciona dos métodos alternativos para
acceder a un nodo específico: acceso a través de
sus nodos padre y acceso directo.

Las funciones que proporciona DOM para acceder a
un nodo a través de sus...