Logo

El DOM (document object model) marca la escructura de la página

Aprende Web

Crea y diseña tus sitios en la Web.

Manual de DOM

logo
WEB-GRAFÍA

Mi agradecimiento a las siguientes páginas Web. en las cuales me he basado para la elaboración de este manual:


Introducción a XML
Desarrollo Web
DOM
mozilla.org
php: DOM manual
php.net
Document Object Model (DOM) Level 1 Specification
W3C.org
Especificación del Modelo de Objetos del Documento (DOM), Nivel 1
Traducción de W3C: conclase.net
HTML DOM Tutorial
w3schools.com
XML DOM Tutorial
w3schools.com

Donativos

Aprendeweb es un proyecto no comercial, sin embargo el mantenimiento de la página tiene unos costes. Agradeceríamos si pudieras colaborar con una pequeña contribución:


Twitter

Facebook

Google+

Aprende Webon Google+

DOM (I)

Qué es el DOM

imagen dom

Definición

La W3C define el DOM o "Modelo de Objetos del Documento" como "una interfaz de programación de aplicaciones (API) para documentos HTML y XML." Es decir es la base o programa base sobre la que se construyen los documentos de HTML y XML. Todos los navegadores y otras aplicaciones que quieran mostrar documentos en estos formatos deben tener este programa base o interfaz. La W3C indica que el DOM "define la estructura lógica de los documentos y el modo en que se accede y manipula un documento."

La W3C especifica: "Con el Modelo de Objetos del Documento los programadores pueden construir documentos, navegar por su estructura, y añadir, modificar o eliminar elementos y contenido". Es decir que tiene una escructura flexible en la cual se pueden añadir o quitar elementos.


Estructura

En el DOM los documentos tienen una estructura parecida a un arbol, creando una estructura jerarquica en la que de un objeto principal pueden depender varios secundarios. Esto se ve claramente en la escructura que tiene la página de HTML, la cual consta de etiquetas anidadas.

Por ejemplo si tenemos una página web sencilla:

<html>
<head>
  <title>mi página</title>
</head>
<body>
  <h1>Hola mundo</h1>
	<p>Esta es mi página.</p>
</body>
</html>

En el DOM se representa como una estructura de arbol de la siguiente manera:

Arbol del DOM

Cada uno de los recuadros de la estructura anterior es un nodo. los nodos son los elementos básicos de la estructura del DOM. Estos se relacionan unos con otros en una estructura jerárquica, de modo que cada nodo tiene un nodo superior del que depende, que es el nodo padre, y puede tener 0, 1, ó varios nodos dependientes de él, que serán sus nodos hijos. Los nodos que están a un mismo nivel, y que dependen todos del mismo nodo padre, se dice que son nodos hermanos. Todo el arbol del DOM depende de un nodo principal a partir del cual se generan todos los demás. Es el nodo Document.


Tipos de nodos

Aunque existen 12 tipos de nodos en realidad en las páginas web sólo tenemos los 5 siguientes:

Los demás tipos de nodos son: CDATASection, EntityReference, Entity, ProcessingInstruction, DocumentType, DocumentFragment, Notation. Veamos de momento en qué consisten:


El DOM y HTML

El DOM en sí es un "Modelo", ni HTML ni XML siguen estrictamente este modelo, ya que hay nodos que no aparecen en HTML, o algunos elementos que faltan en XML. Con todo, estos lenguajes toman al DOM como referencia para su propia organización de la sintaxis.

Si bien es verdad que todo documento HTML tiene una escructura que procura ajustarse al DOM, el DOM, en si mismo, como modelo, es una referencia con la que se han creado algunos lenguajes que se usan en la Web.

El DOM en sí mismo no pone nombre a las etiquetas de HTML, es el HTML el que asocia las etiquetas, atributos, y demás componentes, con los elementos de una estructura tipo DOM. Es por eso que el DOM, tal como ocurre en XML, permite que creemos nuevas etiquetas con nuevos nombres.






Aunque no forma parte estrictamente del DOM, por su importancia y por ser el origen de todos los demás objetos del navegador, veremos los métodos y propiedades del objeto window.

El objeto window



Manual de DOM

Anterior siguiente ... Siguiente siguiente

Estadísticas con Motigo

Free counter and web stats

imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Más sobre anyelguti en http://anyelguti.16mb.com