Astuces du SpeeDEricH.com

INITIATION AU JAVA SCRIPTJAVA SpeeDEricH.com

AFFICHER DU TEXTE

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 :
javaDOCWRITE 01
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";

Retour au Sommaire Javascript Suite de l'initiation : Les Variables

ED  05/03/03
WebO
SpeeDEricH.com Nedstat Tu mesures ton audience ?