5. Manipulation du browser et de fenêtres

5.1 Informations sur le navigateur

Avec JavaScript on peut obtenir de l’information sur le client que vous utilisez
Cette exemple montre aussi comment générer du HTML avec Javascript

Exemple 5-1: Information sur le browser avec Javascript

Pour voir: http://tecfa.unige.ch/guides/js/ex-intro/info.html

Voici le code:

<script language="JavaScript">// pour connaître l’heure et la date il faut d’abord créer un objet Date.today = new Date()document.write("<li>Heure: ",today.getHours(),":",today.getMinutes(), " h ")document.write("<li>Jour de la semaine: ", today.getDay(), ", Date: ", today.getDate(),"/", today.getMonth()+1,"/",today.getYear());document.write("<li>Document Referer=", document.referrer);document.write("<li>Version Navigator: ", navigator.appName, " , Version = ", navigator.appVersion, " , User agent = ", navigator.userAgent, ", Code Name = ", navigator.appCodeName);if (navigator.javaEnabled()) {   document.write("<li>Java marche (enabled)");   }   else   document.write("<li>Java ne marche pas (faites quelque chose!)");</script>

document.write() est une méthode pour “écrire” dans le document courant.
Important: Il n’est pas possible de modifier ce qui a été écrit sans recharger la page.

5.2 Ouvrir une nouvelle fenêtre

Exemple 5-2: Création d’une nouvelle fenêtre I

http://tecfa.unige.ch/guides/js/ex-intro/fenetre.html

Notez comment on appelle les méthodes: nom_objet.méthode()
la méthode window.open() permet d’ouvrir une nouvelle fenêtre du browser (voir la documentation pour les paramètres)
Lorsqu’on ouvre une nouvelle fenêtre, ca crée un objet qu’il faut stocker dans une variable (ici: win ) afin de pouvoir l’utiliser

     win = window.open("", "Resultats", .....);

la méthode xxx.document.open initialise l’objet document de la fenêtre (dans lequel on va "écrire")

     win.document.open();

"document" est une propriété de l’objet xxx qui contient l’objet document associé avec le window xxx.
xxx.document.writeln () permet d"écrire" du code HTML
xxx.document.close va finaliser la page (afficher le contenu pour l’utilisateur).

   win.document.close();

Note: document.writeln ("bla") (sans le xxx) aurait été utilisé pour écrire quelque chose dans la page HTML courante, mais comme on écrit depuis la page courante vers une autre fenêtre, il faut utiliser:

   win.document.writeln ("Salut");

Voici le code:

function ouvrir () {  // on crée un nouvelle fenêtre  win = window.open("", "Resultats",        "width=250,height=150,status=1,resizable=1");  // on ouvre l’acces au contenu de la fenêtre  win.document.open();  // Ici on devrait d’abord écrire une jolie entête HTML <head> ....  // Mais on s’en passe et on affiche juste un message  win.document.writeln ("<h1>Message secret</h1>");  win.document.writeln ("Bonjour cher ami!");  // On rajoute un bouton pour fermer cette fenetre  win.document.writeln ("<hr><center><form><input type=’button’ value=’FERMER’ onClick=’window.close()’>");  // Et on finalise, rien n’est affiché avant ce document.close () !!  win.document.close();}....<hr><form><input type="button" name="ProcessButton" value="Voir un truc"       onClick="ouvrir()"></form><hr>

Exemple 5-3: Création d’une nouvelle fenêtre II

Cet exemple est plus compliqué, il montre

comment on peut faire un bouton permettant de fermer la fenêtre
comment écrire une fonction un peu générale
comment utiliser une variable pour "construire" le contenu (c’est idiot d’écrire pleins de xx.document.writeln)

Voir: http://tecfa.unige.ch/guides/js/exemples/createw.html