Jerarquía de objetos en JavaScript: objeto WINDOW

Jerarquía de objetos en JavaScript: objeto WINDOW

El objeto WINDOW representa una ventana o marco del navegador. Es el elemento raíz de la estructura de objetos de cada página HTML.

Tiene definidos los eventos: onBlur, onDragDrop, onError, onFocus, onLoad, onMove, onResize, onUnload.

Propiedades del objeto WINDOW

Arrays de elementos contenidos en la ventana actual
frames Array de marcos (frames) de la ventana actual
Otros atributos
closed Vale true si esa ventana ha sido cerrada
defaultStatus Mensaje por defecto que se muestra en la barra de estado de esa ventana
document Objeto document asociado a la ventana
history Historial de URLs visitadas
innerHeight Altura del área de contenido de la ventana (en pixels)
innerWidth Ancho del área de contenido de la ventana (en pixels)
length Número de marcos en la ventana (equivalente a frames.length)
location Objeto location asociado a la ventana. Contiene información sobre el URL actual.
locationbar Barra de dirección (URL) del navegador. Contiene a su vez la propiedad ‘visible’ que indica si se muestra o no la barra en la ventana actual.
menubar Barra de menú del navegador. Contiene la propiedad ‘visible’ que indica si se muestra o no la barra en la ventana actual.
name Nombre de la ventana
opener Ventana que abrió la ventana actual a través del método open(). Por ejemplo, para saber el nombre de dicha ventana: nombre=window.opener.name;
outerHeight Altura de la ventana en pixels
outerWidth Ancho de la ventana en pixels
pageXOffset Posición horizontal (en pixels) de la página con respecto a la ventana
pageYOffset Posición vertical (en pixels) de la página con respecto a la ventana
parent Representa el nombre de la ventana o marco que contiene a la ventana actual
personalbar Barra de directorios del navegador
scrollbars Barras de desplazamiento del navegador
self Representa la ventana actual
status Mensaje de la barra de estado
statusbar Barra de estado de la ventana
top Representa la ventana de nivel superior (raíz) en una estructura de marcos
window Representa la ventana actual (como self)

Resumen de métodos del objeto WINDOW

Métodos
alert Muestra una ventana de mensajes. Ejemplo:if (numero>10) alert (“Fuera de rango”);
back Carga la URL anterior de la lista del objeto HISTORY correspondiente a la ventana de nivel superior:window.back();
clearInterval Cancela un temporizador iniciado con setInterval
clearTimeout Cancela un temporizador iniciado con setTimeout
close Cierra la ventana especificada (dependiendo de la seguridad implementada en cada navegador puede que sólo funcione con ventanas abiertas con el método open):otraventana = window.open(“”)
otraventana.close ()
find Busca una cadena de texto en el contenido de la ventana especificada:find (cadena, mayusculas, siguiente)Si ‘mayusculas’ es true, se lleva a cabo una búsqueda que tiene en cuenta mayúsculas y minúsculas. Si ‘siguiente’ es true, se busca la siguiente coincidencia.

Si no se especifica ‘cadena’, el navegador lanza la ventana de búsqueda. La función devuelve true si se encontró la cadena.

confirm Muestra una ventana de confirmación con los botones OK y CANCEL. Devuelve ‘true’ si el usuario pulsa OK y ‘false’ en caso contrario.
focus Asigna el foco a un objeto
forward Carga la siguiente URL de la lista del objeto HISTORY
handleEvent Llama a la función encargada de manejar el evento especificado
home Carga la URL definida como ‘HOME’ en el navegador
moveTo Mueve la ventana a las coordenadas especificadas:window.moveTo(25,10);
open Abre una nueva ventana del navegador [*]
print Imprime el contenido de la ventana
resizeBy Redimensiona la ventana moviendo la esquina inferior derecha a las coordenadas especificadas:window.moveTo (100,100);
// redimensionar a 400×400 pixels
window.resizeBy (500, 500);
resizeTo Redimensiona la ventana a los nuevos valores de ancho y alto:// redimensionar a 400×400 pixels
window.resizeTo (400, 400);
scrollBy Desplaza el contenido de la ventana la cantidad indicada
scrollTo Desplaza el contenido de la ventana
setInterval Establece un temporizador cíclico que se encarga de evaluar una expresión regularmente [*]
setTimeout Establece un temporizador que evalúa una expresión una vez transcurrido el tiempo asignado [*]
stop Detiene el proceso de carga de la página actual

El método open se utiliza para abrir nuevas ventanas del navegador. Los parámetros son:

open ( URL, nombre_de_la_ventana, opciones);

Las opciones se especifican mediante una secuencia de pares ‘parametro=valor‘ separados por comas (sin espacios en medio):

Algunas opciones del método open()
dependent Crea una ventana hija de la ventana actual. Esta ventana se cerrará automáticamente cuando lo haga su ventana padre.
height Altura de la ventana (en pixels)
location Si es ‘yes’, crea una entrada para las direcciones (URLs) en la nueva ventana.
menubar Si es ‘yes’, crea una barra de menú en la nueva ventana.
resizable Si es ‘yes’, el usuario podrá redimensionar la ventana.
scrollbars Si es ‘yes’, aparecerán barras de desplazamiento en la nueva ventana (cuando el documento supere las dimensiones de la misma).
status Si es ‘yes’, la nueva ventana tendrá barra de estado.
titlebar Si es ‘yes’, aparecerá la barra de título en la nueva ventana.
toolbar Si es ‘yes’, la ventana tendrá barra de herramientas.
width Ancho de la ventana (en pixels)

Por ejemplo, para abrir una página en una nueva ventana:

window.open (“pagina2.html”, “ventana2” );

Una nueva ventana con barra de menú, pero sin barra de estado, ni entrada para direcciones:

window.open (“pagina2.html”, “ventana2”, “status=no, location=no, menubar=yes”);

Si no se especifica URL, la ventana se abre sin cargar ninguna página. Si la ventana ya existe, no se borra la página que está cargada en ese momento.

El siguiente ejemplo abre una nueva ventana y construye su contenido de forma dinámica (on-the-fly):

<html>
<head>
<script language=”JavaScript”>
<!–
function abreNuevaVentana(nombreVentana)
{
// abrir una nueva ventana con el nombre pasado como parámetro
// no se especifica una URL
miVentana= open(“”, nombreVentana,”width=500, height=400, status=yes, toolbar=yes ,menubar=yes”);
// Abre la corriente de datos del documento para escribir
miVentana.document.open();
// Crea el documento
miVentana.document.write(“<html><head><title>On-the-fly”);
miVentana.document.write(“</title></head><body>”);
miVentana.document.write(“<h1>Creando documentos al vuelo</h1>”);
miVentana.document.write(“<p>&nbsp;</p>”);
miVentana.document.write(“<p>El contenido es din&aacute;mico</p>”);
miVentana.document.write(“</body></html>”);

// cierra la corriente de datos del documento
miVentana.document.close();
}
// –>
</script>
</head>
<body>
<form><input type=button value=”On-the-fly” onClick=”abreNuevaVentana(“nueva”)”></form>
</body>
</html>

Los métodos setInterval y setTimeout permiten establecer temporizadores en la ventana. Por ejemplo, el siguiente código muestra un mensaje transcurridos 10 segundos utilizando el método setTimeout:

<html>
<head>
<script language=”javascript”>
function temporizador()
{
window.setTimeout (“alert(‘Mensaje’)”, 10000);
}

</script>
</head>

<body bgcolor=”#FFFFFF”>
<form method=”post” action=””>
Muestra un mensaje dentro de 10 segundos
<input type=”button” name=”Button” value=”ok” onClick=”temporizador();”>
</form>
</body>
</html>

Para establecer temporizadores cíclicos se utiliza el método setInterval. Por ejemplo, para establecer un aviso cada 5 segundos:

window.setInterval (“alert (‘Han pasado 5 segundos’)”, 5000);

Artículo (C) Epsilon Eridani.

¡¡ Comenta este artículo en los foros !!
comenta