![]() |
|
INITIATION
AU JAVA SCRIPT |
Méthode de l'objet document
: Souviens-toi ... Je t'ai montré que ce qui apparaît sur
ton écran, peut être "découpé" en objets et que Javascript allait te donner
la possibilité d'accéder à ces objets (Théorie objet).
La page HTML qui s'affiche dans la fenêtre du browser est un objet de type document.
A chaque objet Javascript, le concepteur du langage a prévu un ensemble de méthodes (ou
fonctions dédiées à cet objet) qui lui sont propres. A la méthode document, Javascript
a dédié la méthode "écrire dans le document", c'est la méthode
write(). L'appel de la méthode se fait selon la notation :
nom_de_l'objet.nom_de_la_méthode.
Pour appeler la méthode
write() du document, tu noteras : document.write();
La méthode write() : la syntaxe est assez simple soit :
write("ton texte");
On peut aussi écrire une variable, soit la variable
resultat : write(resultat);
Pour associer du texte (chaînes de
caractères) et des variables, utilise l'instruction write : ("Le résultat est " +
resultat);
Tu peux utiliser les balises HTML pour agrémenter ce
texte : write("<B>Le résultat
est</B>" + resultat); ou
write ("<B>" + "Le
résultat est " + "</B>" + resultat) Exemple :
Tu vas écrire du texte en HTML et en
Javascript.
<HTML>
<BODY>
<H1>Ceci est du HTML</H1>
<SCRIPT LANGUAGE="Javascript">
<!--
document.write("<H1>Et ceci du Javascript</H1>");
//-->
</SCRIPT>
</BODY>
</HTML>
Ce qui donnera comme résultat :

L'instruction writeln()
La méthode writeln() est fort proche de
write() à ceci près qu'elle ajoute un retour chariot à la fin des caractères
affichés par l'instruction. Ce qui n'a aucun effet en HTML.
Pour faire fonctionner write() il
faut l'inclure dans des balises <PRE>.
<PRE>
<SCRIPT LANGUAGE="Javascript">
<--
document.writeln("Ligne 1");
document.writeln("Ligne 2");
//-->
</SCRIPT>
</PRE>
Autrement dit l'emploi de
writeln() est anecdotique et tu utiliseras simplement le tag <BR> avec la méthode
write().
De la belle écriture en Javascript ...
variable.big();
l'emploi de .big() affichera la variable comme si elle était comprise entre les balises
HTML <BIG></BIG>. Les quatre instructions Javascript suivantes sont équivalentes :
str="Something"; (str est une variable)
document.write("<BIG>"+str+"</BIG>");
document.write('<BIG>Something</BIG>');
document.write(str.big());
document.write("Something".big());
variable.small(); l'emploi de .small() affichera la variable comme si elle était comprise entre les balises
HTML <SMALL></SMALL>. Les quatre instructions Javascript suivantes sont équivalentes :
str="Something";
document.write("<SMALL>"+str +"</SMALL>");
document.write("<SMALL>Something" +"</SMALL>");
document.write(str.small());
document.write("Something".small());
variable.blink(); l'emploi de .blink() affichera la variable comme si elle était comprise entre les balises
HTML <BLINK></BLINK>. Pour rappel, cette balise (qui est par ailleurs vite ennuyeuse) n'est
valable que sous Netscape 3 et plus. Les quatre instructions Javascript suivantes sont
équivalentes :
str="Something";
document.write('<BLINK>'+str+'</BLINK>');
document.write("<BLINK>Something</BLINK>");
document.write(str.blink());
document.write("Something".blink());
variable.bold(); l'emploi de .bold() affichera la variable comme si elle était comprise entre les balises
HTML <B></B>. Les quatre instructions Javascript suivantes sont équivalentes :
str="Some words";
document.write("<B>"+str+"</B>");
document.write("<B>Some words</B>");
document.write(str.bold());
document.write("Some words".bold());
variable.fixed(); l'emploi de .fixed() affichera la variable comme si elle était comprise entre les balises
HTML <TT></TT>. Les quatre instructions Javascript suivantes sont équivalentes :
str="Something";
document.write("<TT>"+str+"</TT>");
document.write("<TT>Something</TT>");
document.write(str.fixed());
document.write("Something".fixed());
variable.italics(); l'emploi de .italics() affichera la variable comme si elle était comprise entre les balises
HTML <I></I>. Les quatre instructions Javascript suivantes sont équivalentes :
str="Something";
document.write("<I>"+str+"</I>");
document.write("<I>Something</I>");
document.write(str.italics());
document.write("Some word".italics());
variable.fontcolor(color ); l'emploi de .fontcolor(color) affichera la variable comme si elle était comprise entre les balises
HTML <FONT
COLOR="color"> </FONT>.
Les quatre instructions Javascript suivantes sont équivalentes :
str1="Some words";
str2="red";
document.write("<FONT COLOR='red'>" +str1+"</FONT>");
document.write("<FONT COLOR='red'>" +"Something</FONT>");
document.write(str1.fontcolor(str2));
document.write(str1.fontcolor("red"));
variable.fontsize(x); l'emploi de .fontsize(x) affichera la variable comme si elle était comprise entre les balises
HTML <FONT SIZE="x"></FONT> où x est
un nombre de 1 à 7 ou exprimé en plus ou en moins par rapport à 0 par exemple -2, -1,
+1, +2.
Les quatre instructions Javascript suivantes sont équivalentes :
str="Something";
x=3;
document.write("<FONT SIZE=3>" +str+"</FONT>");
document.write("<FONT SIZE=3>" +"Something</FONT>");
document.write(str.fontsize(3));
document.write(str.fontsize(x));
variable.strike(); l'emploi de .strike() affichera la variable comme si elle était comprise entre les balises
HTML <STRIKE></STRIKE>. Les quatre
instructions Javascript suivantes sont équivalentes :
str="Something";
document.write("<STRIKE>"+str +"</STRIKE>");
document.write("<STRIKE>Something" +"</STRIKE>");
document.write(str.strike());
document.write("Something".strike());
variable.sub(); l'emploi de .sub() affichera la variable comme si elle était comprise entre les balises
HTML <SUB></SUB>. Les quatre
instructions Javascript suivantes sont équivalentes :
str="Something";
document.write("<SUB>"+str+"</SUB>");
document.write("<SUB>Something" +"</SUB>");
document.write(str.sub());
document.write("Something".sub());
variable.sup(); l'emploi de .sup() affichera la variable comme si elle était comprise entre les balises
HTML <SUP></SUB>. Les quatre
instructions Javascript suivantes sont équivalentes :
str="Something";
document.write("<SUP>"+str+"</SUP>");
document.write("<SUP>Something</SUP>");
document.write(str.sup());
document.write("Something".sup());
Les instructions de formatage de document ...
souviens toi d'abord que ce qui suit est optionnel et que
tu peux utiliser l'instruction document.write() de façon tout à fait classique.
Soit : document.write("<BODY BGCOLOR="#FFFFFF");
document.bgColor
cette instruction permet de spécifier la couleur
d'arrière-plan d'un objet document.
On peut employer le nom ou la valeur RGB de la couleur. document.bgColor="white";
document.bgColor="#FFFFFF";
document.fgColor cette instruction te permet de spécifier la couleur
d'avant-plan (texte) d'un objet document.
On peut employer le nom ou la valeur RGB de la couleur. document.fgColor="black";
document.fgColor="#000000";
document.alinkColor cette instruction te permet de spécifier la couleur d'un
lien actif (après le clic de la souris mais avant de quitter le lien) d'un objet
document.
Tu peux employer le nom ou la valeur RGB de la couleur. document.alinkColor="white";
document.alinkColor="#FFFFFF";
document.linkColor cette instruction te permet de spécifier la couleur d'un
hyper lien d'un objet document.
Tu peux employer le nom ou la valeur RGB de la couleur. document.linkColor="white";
document.linkColor="#FFFFFF";
document.vlinkColor cette instruction te permet de spécifier la couleur d'un
hyper lien déjà visité d'un objet document. Tu peux employer le nom ou la valeur RGB de
la couleur. document.linkColor="white";
document.linkColor="#FFFFFF";