all html : Le portail des webmaster

Article publié le samedi 13 mars 2004 par ALL HTML.
Cet article est classé dans les catégories « Javascript »

Introduction à l'objet window

L'objet window est compatible avec les navigateurs Netscape Navigator et Internet Explorer : c'est l'objet maître du Javascript (implicite)! Il peut être défini comme une véritable fenêtre, où l'objet document est considéré comme le contenu de cette même fenêtre. L'utilisation la plus courante est la création d'une fenêtre volante (popup).

Hiérarchie de l'objet window

html47.gif

Les principales propriétés de l'objet window

Exemple d'utilisation : window.propriété

<br><br><table border="1" bordercolor="#330033" cellpadding="3" cellspacing="1" width="489"><tbody><tr><td align="center" bgcolor="#6699cc"><span class="texte"><b>Propriété</b></span></td><td align="center" bgcolor="#6699cc"><span class="texte"><b>Description</b></span></td></tr><tr><td><span class="texte"><b>closed</b></span></td><td><span class="texte">Indique si une fenêtre a été fermée</span></td></tr><tr><td><span class="texte"><b>defaultstatus</b></span></td><td><span class="texte">Message par défaut contenu dans la barre d'état du navigateur</span></td></tr><tr><td><span class="texte"><b>document *</b></span></td><td><span class="texte">Représente le contenu de la fenêtre (lecture seule)</span></td></tr><tr><td><span class="texte"><b>history *</b></span></td><td><span class="texte">Historique de la fenêtre (lecture seule)</span></td></tr><tr><td><span class="texte"><b>length</b></span></td><td><span class="texte">Nombre de frames dans la fenêtre courante</span></td></tr><tr><td><span class="texte"><b>location *</b></span></td><td><span class="texte">URL courante de la fenêtre</span></td></tr><tr><td><span class="texte"><b>name</b></span></td><td><span class="texte">Nom d'une fenêtre</span></td></tr><tr><td><span class="texte"><b>parent</b></span></td><td><span class="texte">Indique une fenêtre d'un cadre (frame)</span></td></tr><tr><td><span class="texte"><b>self</b></span></td><td><span class="texte">Indique la fenêtre courante</span></td></tr><tr><td><span class="texte"><b>status</b></span></td><td><span class="texte">Lit ou écrit le contenu de la barre d'état du navigateur</span></td></tr><tr><td><span class="texte"><b>statusbar</b></span></td><td><span class="texte">Affichage ou non de la barre d'état du navigateur</span></td></tr><tr><td><span class="texte"><b>toolbar</b></span></td><td><span class="texte">Affichage ou non de la barre d'outils du navigateur</span></td></tr><tr><td><span class="texte"><b>top</b></span></td><td><span class="texte">Indique l'objet fenêtre le plus haut</span></td></tr></tbody></table><br>

* : Ces propriétes de l'objet window sont également des objets.

Les principales méthodes de l'objet window

Exemple d'utilisation : window.méthode(arg)

<br><br><table border="1" bordercolor="#330033" cellpadding="3" cellspacing="1" width="489"><tbody><tr><td align="center" bgcolor="#6699cc"><span class="texte"><b>Méthode</b></span></td><td align="center" bgcolor="#6699cc"><span class="texte"><b>Description</b></span></td></tr><tr><td><span class="texte"><b>alert('message')</b></span></td><td><span class="texte">Permet d'afficher une boîte de dialogue (avertissement)</span></td></tr><tr><td><span class="texte"><b>back()</b></span></td><td><span class="texte">URL précédente (historique) du navigateur</span></td></tr><tr><td><span class="texte"><b>blur()</b></span></td><td><span class="texte">Permet de désactiver la fenêtre spécifiée</span></td></tr><tr><td><span class="texte"><b>clearTimeout</b></span></td><td><span class="texte">Efface la fonction "chronomètre"</span></td></tr><tr><td><span class="texte"><b>close()</b></span></td><td><span class="texte">Permet de fermer la fenêtre spécifiée</span></td></tr><tr><td><span class="texte"><b>confirm(arg)</b></span></td><td><span class="texte">Permet d'afficher une boîte de dialogue (confirmation)</span></td></tr><tr><td><span class="texte"><b>focus()</b></span></td><td><span class="texte">Active la fenêtre spécifiée</span></td></tr><tr><td><span class="texte"><b>forward()</b></span></td><td><span class="texte">URL suivante (historique) du navigateur</span></td></tr><tr><td><span class="texte"><b>open(arg)</b></span></td><td><span class="texte">Permet d'ouvrir une nouvelle fenêtre</span></td></tr><tr><td><span class="texte"><b>prompt()</b></span></td><td><span class="texte"> Permet d'afficher une boîte de dialogue (informations à saisir par l'utilisateur)</span></td></tr><tr><td><span class="texte"><b>setTimeout</b></span></td><td><span class="texte">Permet d'activer une fonction "chronomètre" (en ms)</span></td></tr></tbody></table>

Quelques exemples

Exemple 1 : comme vu plus haut, la propriété window (avec la méthode open) est couramment utilisée pour ouvrir une fenêtre. Voici les différentes caractéristiques d'une fenêtre.

Syntaxe : window.open('URL','nom_fenêtre','caractéristiques')

html48.gif

1) menubar (défaut : no).
2) toolbar (défaut : no).
3) location (défaut : no).
4) status (défaut : no).
5) scrollbars (défaut : no).

Note : La valeur resizable, si elle est égale à yes, permet au visiteur de redimensionner la fenêtre. Les valeurs top et left permettent de positionner (par rapport à la fenêtre maître) la nouvelle fenêtre.

<form> <input type="button" value="Exemple" name="Exemple" onclick="window.open('fenetre.htm', 'Exemple', 'width="250",height="300",top="120",left="120")" /> </form>

Note : A l'intérieur de cette fenêtre vous pouvez créer un bouton de fermeture.

<form> <input type="button" value="Fermer !!" onclick="window.close()" /> </form>