Más sobre el Modelo de Objeto de Documento
(DOM)

Hasta ahora hemos aprendido que JavaScript incluye objetos por defecto como Windows. Hemos aprendido que los objetos tienen propiedades que los describen y métodos que describen qué es lo que saben hacer y como lo hacen. Ahora es tiempo de profundizar un poco estos conocimientos.

Una cosa buena sobre objetos es que las propiedades de un objeto pueden ser también objetos. Por ejemplo, las ventanas tienen una propiedad llamada documento que se refiere al documento real HTML en la ventana. Este propiedad documento es en sí misma un objeto que tiene propiedades y métodos que le son propios. Hemos visto un ejemplo de esto cuando hablamos sobre intercambio de imágenes. Volviendo a la última lección, aprendimos que puede intercambiar imágenes como esto:

<a href="#" onMouseOver=
"window.document.the_image.src='button_d.gif';">
change</a>

Esta larga tira, window.document.the_image.src='button_d.gif', se traduce en: "Encuentre la propiedad de la ventana del documento, encuentre la propiedad del documento the_image, encuentre la propiedad src de the_image y establézcala a button_d.gif". ¿Demasiado palabrerío, no?. Todo funciona porque son objetos, documento dentro de windows es un objeto y las imágenes dentro de los documentos también son objetos.

Parece como demasiado detalle, pero realmente no es muy complicado y por otro lado parece bastante lógico. El DOM de JavaScript, describe una pequeña jerarquía de objetos, aquí está:

La caja superior del diagrama representa a la ventana de su navegador. Siguiendo la línea desde esa caja y hacia abajo, veremos 7 cajas interconectadas. Estas son las propiedades de la ventana (window) del navegador. La sexta caja, "document", representa los contenidos de su ventana. Si sigue la pequeña línea desde la caja documento verá que se conecta a seis cajas más. Estas son las propiedades del objeto documento. Note que la cuarta caja son imágenes "images". Esta es la lista de todas las imágenes de su página Web. Debido a que las imágenes son propiedades del "document", que a su vez es una propiedad de "window", el modo preciso de describir una imagen para JavaScript es decir que mire en la "window", que encuentre el "document" de la ventana y en el documento buscar la imagen.

 

Las propiedades del objeto documento lo veremos en breve.

Sin embargo, antes de que le pueda extraer todo su potencial de este objeto, debería conocer como manejar los conceptos del DOM en otras ventanas.