Tutorial JavaScript


Propiedades de los objetos

Modelo Objeto Documento
(Document Object Model - DOM)

Ahora que sabe abrir una ventana con características determinadas, es tiempo de aprender como manejar cosas dentro de una ventana. Para realmente tener el control sobre las cosas que aparecen en una ventana, tiene que aprender los conceptos detrás del JavaScript Document Object Model (DOM). Antes que aprenda algo sobre DOM, le ayudará recordar algo sobre programación orientada a objeto.

Un breve repaso

La programación orientada a objeto, especialmente la que está presente en JavaScript no es difícil de aprender. La idea principal es que la información se organiza en términos de objetos. JavaScript es hermoso porque viene con una biblioteca incorporada de objetos. Por ejemplo, una ventana es un objeto. Cada vez que me refiero a uno de los objetos por defecto de JavaScript comenzaré con una mayúscula (Window). Instancias específicas (una ventana en particular) estarán en minúsculas.


Propiedades de los objetos

Los objetos tienen propiedades que los describen. Algunas de las propiedades de un objeto Window es su nombre, las palabras en su barra de estado, la URL del documento dentro de la ventana y el documento de la ventana en sí mismo que incluye las palabras imágenes y enlaces dentro de la ventana.

En JavaScript tiene un objeto Ventana por defecto que es donde se ubican todas las cosas llamada window. Una de las propiedades de una ventana son las palabras en su barra de estado. Para saber que palabras están presentes en la barra de estado se realiza lo siguiente:

var estado = window.status;

Esto dice: "Encuéntrame la propiedad estado del objeto Ventana llamada windows y cárguelo en la variable estado". Además de leer cuales son estas palabras, puede también cambiarlas. La forma de establecer las propiedades de un objeto es:

window.status = "La vida es bella!";

Realice un programa JavaScript que al pasar el mouse sobre un enlace describa, sobre la barra de estado, de que se trata dicho enlace

Veamos el siguiente código:

<a href="#" onMouseOver="window.status='Actualiza la Base de Datos';return true;">

Actualizar

</a>

Esto dice, "Cuando el mouse se mueva sobre este enlace, cambie la barra de estado". Si lo mira detenidamente advertirá un "return true" dentro de la cláusula onMouseOver. Si no pusiera esto, el navegador haría lo que normalmente hace cuando mueve el cursor sobre un enlace, mostrará la URL descripta en href y lo pondrá en la barra de estado, reemplazando el texto que Ud. puso en la barra de estado.

Poniendo return true en onMouseOver, le impide al navegador que haga esto. No obstante se puede usar "return false" dentro de onClick para impedir al navegador que cargue la URL especificada.

<a href="#" onClick="return false;">este enlace no hace nada!</a>

Porque se pone return false en un onClick y return true en un onMouseOver es uno de los misterios de la vida que mejor es dejarlo como misterio.


¡Visita también estos sitios interesantes!

Sitio alojado en Yaia.com