Un article de WikiTuto.

Catégorie:Cours DHTML DHTML Concepts de base Introduction Les premiers effets Premiers pas dans le DOM Qu'est-ce que le DOM? Accès aux éléments et attributs Avoir des informations sur les nœuds DOM: modification du contenu dans un document Modification de contenu Ajout de contenu Suppression de contenu Accès aux feuilles de style par le DOM Propriétés générales de la feuille de style Modification, ajout et suppression de règles Le DOM: fenêtre, navigateur et interface-utilisateur La géométrie de la fenêtre et de l'écran Manipuler le navigateur et le système Simplifier la vie de l'utilisateur: gestion de l'interface Gestion des événements et DOM Comment appeler un événement? flot d'événements L'objet Event modifier Tdm DHTML Source : Gilles Chagnon

Sommaire 1 Informations sur le navigateur 1.1 Exercice 1. Informations sur le navigateur 2 Informations sur le document 3 Modification du document chargé 3.1 Accès à l'historique du navigateur 3.2 Modification directe de l'URL du document chargé 3.3 Exercice 1. Historique 4 Gestion des fenêtres 4.1 Ouverture et fermeture de fenêtre 4.2 Relation entre deux fenêtres 5 Voir aussi 6 Sources

Informations sur le navigateur

On peut accéder à nombre d'informations sur le navigateur à l'aide de la collection navigator de l'objet window.

• window.navigator.appName retourne le nom du navigateur.

• window.navigator.appVersion retourne le numéro de version du navigateur ainsi que diverses informations sur le système.

• window.navigator.language retourne la langue du navigateur. Cette propriété n'est pas supportée par Internet Explorer.

• window.navigator.platform retourne la plateforme sur laquelle fonctionne le navigateur (dans le cas de Windows, la chaîne retournée est "Win32").

• window.navigator.product retourne le nom du produit (dans le cas de Mozilla, il s'agit de Gecko).

On peut également savoir si le document rendu l'est en mode Quirks ou Strict grâce à la propriété document.compatMode Dans le premier cas, la chaîne retournée est "BackCompat", dans le second "CSS1Compat". Le mode est quirks quand le DOCTYPE est Transitional.

Exercice 1. Informations sur le navigateur

• Énoncé
• Correction

Informations sur le document

En faisant appel à document.lastModified, on a accès à la date de dernière modification du document (en pratique, il s'agit de la date de mise à jour sur le serveur). Attention, la chaîne retournée ne suit pas la même syntaxe entre Mozilla et Internet Explorer.

Modification du document chargé

Accès à l'historique du navigateur

On peut simuler des clics sur les boutons "Suivant" et "Précédent" du navigateur, par des appels respectivement à window.history.forward() et *window.history.back().

• window.history.go(index) permet de se déplacer en avant (avec un index positif) et en arrière (avec un index négatif) dans l'historique.

• window.history.length donne le nombre d'URL stockées dans l'historique de la fenêtre courante.

• document.referrer retourne l'URL de la page ayant lié à la page couramment affichée.

Modification directe de l'URL du document chargé

window.location donne et permet de spécifier l'URL du document chargé dans la fenêtre. La propriété document.URL joue un rôle similaire, à deux nuances près toutefois :

• pour Internet Explorer, la chaîne de caractères retournée par cette deuxième propriété, dans le cas d'un fichier local, fait apparaître des caractères "\" dans le chemin du fichier au lieu de caractères "/" (qui est la syntaxe normale pour une URL, même locale).

• pour Mozilla, cette propriété est en lecture seule, et ne peut donc pas servir à changer l'URL du document affiché.

window.home() renvoie à la page d'accueil du navigateur (non supportée par IE6).

Exercice 1. Historique

• Énoncé
• Correction

Gestion des fenêtres

Ouverture et fermeture de fenêtre

Deux méthodes permettent de gérer les ouverture et fermeture de fenêtre.

• window.close() ferme la fenêtre courante. Les deux navigateurs principaux adoptent des politiques différentes afin de ne pas forcer le comportement de l'utilisateur. Internet Explorer demande une confirmation à l'aide d'une boîte de dialogue, Mozilla refuse de fermer une fenêtre qui n'a pas été ouverte par un script. Opera quant à lui ne se pose pas de question, et ferme la fenêtre sans préavis.

• window.open(url, nom[, parametres]) ouvre une nouvelle fenêtre. Le nom est utile pour des références ultérieures, notamment, par exemple, dans le cas de frames. La chaîne de caractères parametres, optionnelle, permet de spécifier un certain nombre de propriétés. Par exemple, window.open("http://www.alltheweb.com", "nouvellefenetre", "toolbar, location, width=400, height=300, scrollbars, status") indique entre autres que la fenêtre comportera une barre d'outils, la barre de navigation, des barres de défilement et la barre d'état.

Relation entre deux fenêtres

Lorsqu'une fenêtre en ouvre une autre, cette information n'est pas perdue pour la deuxième. La référence à la fenêtre ouvrante peut être récupérée par la propriété fenetre_ouvrante=window.opener. L'objet fenetre_ouvrante est alors utilisable, et modifiable (par exemple, par fenetre_ouvrante.location(...)).

Dans le cas d'un document ouvert dans un frame, il est possible d'avoir accès au frame parent, par... window.parent.

Voir aussi

• La géométrie de la fenêtre et de l'écran
• Manipuler le navigateur et le système
• Simplifier la vie de l'utilisateur: gestion de l'interface

Sources

Gilles Chagnon