Javascript - L'objet Window
Les particularités de l'objet window
L'objet window est l'objet par excellence dans Javascript, car il est le parent
de chaque objet qui compose la page web, il contient donc :
- l'objet document: la page en elle-même
- l'objet location: le lieu de stockage de la page
- l'objet history: les pages visitées précédemment
- l'objet frames: les cadres (division de la fenêtre en sous-fenêtres)
Les propriétés de l'objet window
propriété |
description |
lecture seule |
defaultStatus |
Il s'agit du message qui s'affiche par défaut dans la barre d'état du navigateur |
non, modifiable à tout moment |
frames |
Il s'agit d'un tableau qui contient les cadres présents dans la fenêtre |
Tous les éléments de frames sont en lecture seule |
length |
nombre de cadres (nombre d'éléments du tableau frames |
Lecture seule |
name |
nom de la fenêtre dans laquelle on se trouve |
Lecture seule |
parent |
Il s'agit de la fenêtre qui englobe celle dans laquelle on se trouve (si il y en a une..) |
Lecture seule, contient des propriétés |
self |
Synonyme de la fenêtre actuelle (redondance ou précision?) |
Lecture seule, contient des propriétés |
status |
Il s'agit d'un message temporaire qui s'affiche dans la barre d'état du navigateur suite à un événement |
non, modifiable à tout moment, vous devez retournez la valeur true pour l'utiliser avec onMouseOver |
top |
Il s'agit de la fenêtre de plus haut niveau, celle qui contient tous les cadres (frames) |
Lecture seule, contient des propriétés |
window |
Il s'agit de la fenêtre actuelle... |
Lecture seule, contient des propriétés |
Les propriétés window, self, frames, top et parent permettent de naviguer dans le système
de sous-fenêtres, appelées frames.
- les propriétés self et window sont les mêmes, elles permettent de désigner la
page en cours, leur seul but est d'accentuer la précision de la hiérarchie pour une meilleure
lecture du code. en effet, self.name est plus explicite que name
- les propriété top et parent permettent de remonter dans la hiérarchie pour atteindre
des fenêtre de niveau supérieur, notamment pour "sortir" des frames...
- la propriété frames est un tableau qui permet de cibler un cadre spécifique faisant
partie de la fenêtre où on se trouve. Pour désigner un cadre on utilise soit la notation window.frames[i]
où i représente le numéro du cadre, soit window.nom_du_cadre en désignant le cadre directement
par le nom qu'on lui a assigné dans la balise frameset.
Les méthodes de l'objet window
L'objet window possède des méthodes relatives à l'ouverture
et à la fermeture des fenêtres.
Les méthodes alert(), confirm() et prompt()
Les méthodes alert(), confirm() et prompt() sont des méthodes qui font apparaître une boîte de dialogue,
elles sont expliquées en détail dans le chapitre Boîte de dialogue.
Les méthodes open(), et close()
Les méthodes open() et close() sont bien évidemment destinées
à permettre l'ouverture et la fermeture de fenêtres. Toutefois la syntaxe
de la méthode open() est longue car elle admet un nombre important de paramètres :
La méthode open() permet d'ouvrir une fenêtre, voici sa syntaxe :
window.open("URL","nom_de_la_fenetre","options_de_la_fenetre");
|
Si vous utilisez cette instruction dans un lien hypertexte, veillez à remplacer les guillemets
doubles par des guillemets simples :
<A href="javascript:window.open('URL',
'nom_de_la_fenetre',
'options_de_la_fenetre')">Lien vers URL</A>
Pour les mêmes raisons, le nom de la fenêtre ne doit pas contenir de guillemets. Si cela devait arriver,
vous avez la possibilité de remplacer les guillemets doubles par leur équivalent HTML ("),
et les apostrophes par "\'" ou bien "’". |
URL désigne l'url de la page qui sera affichée dans la nouvelle
fenêtre, c'est-à-dire l'emplacement physique de celle-ci.
Les options de la fenêtre sont les suivantes:
option |
description |
directories = yes/no | Affiche ou non les boutons de navigation |
location = yes/no | Affiche ou non la barre d'adresse |
menubar = yes/no | Affiche ou non la barre de menu (fichier, edition, ...) |
resizable = yes/no | Définit si la taille de la fenêtre est modifiable ou non |
scrollbars = yes/no | Affiche ou non les ascenceurs (barres de défilement) |
status = yes/no | Affiche ou non la barre d'état |
toolbar = yes/no | Affiche ou non la barre d'outils |
width = largeur (en pixels) | Définit la largeur |
height = hauteur (en pixels) | Définit la hauteur |
Ainsi, il est possible d'utiliser cette méthode avec n'importe quel
gestionnaire d'événement, directement dans le code à exécuter ou bien
dans une fonction.
|
- les options doivent être saisies les unes après les autres, séparées
par des virgules, sans espace
- l'ensemble des options doit être encadré par les guillemets
|
Chacune des fenêtres doit cependant être fermée, il faut donc
se servir de la méthode close() qui permet de fermer une fenêtre.
La méthode close() requiert le nom de la fenêtre comme argument, il suffit donc de créer
un bouton (image, hypertexte, ou bouton de formulaire) qui permettra de fermer cette fenêtre.
Pour un lien hypertexte, le code sera :
<A href="javascript:self.close('nom_de_la_fenetre_');">
Cliquez ici pour fermer la fenêtre
</A>
Pour un bouton (image), le code sera :
<A href="javascript:self.close('nom_de_la_fenetre_');">
<img src="nom_de_l_image">
</A>
Il est bien évidemment possible d'utiliser cette procédure avec tous les
gestionnaires d'événement, en utilisant par exemple une
syntaxe proche de celle-ci :
<A href="javascript:;" onMouseOver="self.close('nom_de_la_fenetre_');" >
<img src="nom_de_l_image">
</A>
Trucs & astuces pertinents trouvés dans la base de connaissances
Discussions pertinentes trouvées dans le forum