Il s’agit – comme son nom l’indique – de la page en cours d’exécution. Tous les éléments de la page sont des propriétés ou des méthodes de document. L’objet document étant intégré dans le langage, il n’est pas nécessaire de créer une instance de cette classe.
L’objet document fait partie de l’objet window, mais il n’est pas nécessaire de préciser le suffixe "window."
Propriétés
Toutes ces propriétés correspondent à des éléments de la page ouverte. Cela permet d’uniformiser et de changer quelques détails de la page. On les utilise grâce à la syntaxe habituelle :
document.propriété;
La liste des propriétés est longue ; elle comprend tout ce qui concerne la page en cours. Voici leur liste :
bgColor : couleur du fond.
fgColor : couleur du texte.
linkColor : couleur des liens ni actifs ni visités.
alinkColor : couleurs des liens actifs.
vlinkColor : couleurs des liens visités.
cookie : chaîne de caractères contenant les cookie.
lastModified : date de dernière modification du fichier source
referrer : adresse de la page par laquelle la page en cours a été appelée.
title : titre du document, indiqué par les balises …. N’est modifiable qu’avec Microsoft Internet Explorer.
fileSize : taille de la page en octets.
defaultCharset : jeu de caractère du document chargé.
mimeType : type du document chargé.
URLUnencoded : URL complète de la page, avec les caractères spéciaux encodés.
URL : URL de la page.
protocol : protocole de chargement de la page.
domain : domaine de l’URL complète de la page.
L’exemple qui suit permet d’afficher à l’écran toutes les informations sur la page courante. Cet affichage a une utilité faible, mais ces propriétés peuvent être utiles dans un script de test.
L’objet document possède de plusieurs méthodes, dont certaines qui ont été évoquées déjà vu précédemment. Voici la syntaxe à suivre :
variable = document.méthode();
Elles permettent d’agir sur la page affichée et de savoir ce qui est affiché. Voici la liste de ces méthodes :
write (‘texte’) : affiche le texte et le code HTML dans la page courante.
getSelection () : renvoie le texte qui a été sélectionné dans la page.
handleEvents() : créé un gestionnaire d’évènement.
captureEvents() : détecte un évènement.
open () : ouvre une nouvelle fenêtre de votre browser.
close () : ferme le flux d’affichage externe.
getElementById(ID) : renvoie un objet HTML en fonction de son ID. A ne pas confondre avec le Name.
getElementsByName(nom) : renvoie un objet HTML en fonction de son name.
getElementsByTagName(type) : renvoie un tableau de toutes les balises HTML du type passé en paramètre.
L’exemple suivant réécrit dans une zone de texte les valeurs des lignes de textes au-dessus, séparées par des espaces.
Exemple 16.73 – Méthodes de l’objet Document
New Document
-->
dans la page principale. Pour plus de précisions, consulter un cours HTML.
Frame
Les frames ne sont pas très utilisées en JS, mais il est important de savoir quelques détails en cas d’utilisation de frames au niveau HTML. Il est important, lorsque le JS est utilisé, de préciser le nom de la frame dans la balise .
Ce nom ne paraît pas très utile en HTML, mais il prend toute son importance en JS. Il sera utilisé dans deux cas : la cible des liens ainsi que pour accéder à un élément d’une autre frame de la page.
Lien hypertexte
Lorsque de l’utilisation des frames, il peut s’avérer utile d’afficher une page dans une frame différente de celle où se trouve le lien. C’est là où intervient l’attribut target de la balise . Il permet d’indiquer la frame où l’on veut que la page appelée s’affiche. Voici la syntaxe :
texte
La référence indiquée dans l’attribut target peut être de deux types. Dans un premier cas, il s’agit du nom de la frame déclarée dans la page principale, cas où il faut savoir ce nom. Sinon, si on fait référence au cadre parent, on indiquera « _parent », et si on fait référence à la fenêtre complète, on indiquera « _top ».
Exemple 22.118 – Attribut target des liens
cliquez ici
ou ici
Accès aux éléments des frames
Lorsque de l’utilisation des frames, il est souvent nécessaire en JS d’accéder aux éléments des autres frames. L’objet window – qui a été décrit précédemment – fournit de quoi le faire. Il contient l’objet parent, qui possède les mêmes propriétés que lui.
Objet frames[]
La première façon d’accéder aux éléments d’une autre frame se fait bien sûr par le tableau frames[] – propriété de parent – dont le numéro des frames est attribué dans l’ordre de déclaration de celles-ci. On accède ensuite à chaque élément de la frame ainsi qu’à ses propriétés et méthodes. La syntaxe est la suivante :
parent.frames[i].objet.propriété
parent.frames[i].objet.méthode()
Exemple 22.119 – Objet frames[]
parent.frames[1].form1.action = "get";
Exemple 22.120 – Objet frames[]
parent.frames[1].form1.button1.value = "Click";
Dans l’exemple ci-dessus, on accède à la valeur du bouton appelé « Button1 » du formulaire nommé « form1 ».
Nom de frame
L’autre façon d’accéder aux éléments d’une frame est d’utiliser son nom. Ce sera alors un objet de parent. Il faut donc prendre soin à donner un nom aux frames lors de leur déclaration. On accède ensuite à chaque élément de la frame ainsi qu’à ses propriétés et méthodes.
parent.nom.objet.propriété
parent.nom.objet.méthode()
Les exemples de la section précédente peuvent être écrits de la façon suivante, sans aucune différence au niveau du résultat.
Exemple 22.121 – Nom de frame
parent.frame1.form1.action = "get";
Exemple 22.122 – Nom de frame
parent.frame1.form1.button1.value = "Click";
Exemple concret
L’exemple 22.7 permet de faire un compteur dans lequel les secondes impaires sont affichées une frame et les secondes paires sur l’autre frame.
