Chapitre 3 Utiliser les variables: afficher du
texte...
3.1 Methode de l'objet document
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, on notera : document.write();
3.2 La méthode write()
La syntaxe est assez simple soit
write("votre 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, on utilise l'instruction :
write("Le résultat est " + resultat);
On peut 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);
On va é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 :
Ceci est du HTML Et ceci
du Javascript
3.4 Autres instructions...
L'emploi de .big() affichera la variable comme si elle était
comprise entre les balises <BIG></BIG>. Celui de .small() affichera la variable ... entre les balises
<SMALL> </SMALL>. Celui de
.bold() affichera la variable ... entre les
balises <B></B>. Celui de .fixed() affichera la variable ... entre les balises
<TT></TT>. Celui de
.italics() affichera la variable ... entre les
balises <I></I>. Celui de .fontcolor(color) affichera la variable ... entre les
balises <FONT COLOR="color">
</FONT>. Celui de .fontsize(x)
affichera la variable ... entre les balises <FONT
SIZE="x"></FONT>. Celui de .strike() affichera la variable ... entre les balises
<STRIKE></STRIKE>. Celui de
.sub() affichera la variable ... entre les
balises<SUB></SUB>. Celui de
.sup() affichera la variable ... entre les balises
<SUP></SUP>. Celui de
.blink() affichera la variable ... entre les
balises <BLINK></BLINK>. La
balise .blink() n'est valable que sous Netscape 3
et plus. Par exemple, pour l'instruction .big(), les quatre instructions 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());
3.5 Instructions de formatage de document
Tout ce qui suit est optionnel et
vous pouvez utiliser l'instruction document.write()
de façon tout à fait classique.
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";
Cette instruction permet de spécifier la
couleur d'avant-plan (texte) d'un objet document. document.fgColor="black"; document.fgColor="#000000";
Cette instruction 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. document.alinkColor="white";
document.alinkColor="#FFFFFF";
Cette instruction permet de spécifier la
couleur d'un hyperlien d'un objet document. document.linkColor="white"; document.linkColor="#FFFFFF";
Cette instruction permet de spécifier la
couleur d'un hyperlien déjà visité d'un objet
document. document.vlinkColor="white";
document.vlinkColor="#FFFFFF";
3.6 Les variables en Javascript
Les variables contiennent des
données qui peuvent être modifiées lors de
l'exécution d'un programme. On y fait référence par le nom
de cette variable. Un nom de variable doit commencer par une lettre (alphabet
ASCII) ou le signe_ et se composer de lettres, de chiffres et des
caractères _ et $ (à l'exclusion du blanc). Le nombre de
caractères n'est pas précisé. Pour rappel Javascript est
sensible à la case. Attention donc aux majuscules et minuscules!
Les variables peuvent se déclarer de deux
façons :
· soit de façon
explicite. On dit à Javascript que ceci est une variable. La
commande qui permet de déclarer une variable est le mot var. Par exemple
: var Numero = 1 var Prenom = "Pierre"
· soit de façon
implicite. On écrit directement le nom de la variable suivi de la
valeur que l'on lui attribue et Javascript s'en accommode. Par exemple :
Numero = 1 Prenom = "Pierre"
Malgré cette apparente
facilité, la façon dont on déclare la variable aura une
grande importance pour la "visibilité" de la variable dans le programme
Javascript. Voir à ce sujet, la distinction entre variable locale et
variable globale dans le Javascript avancé de ce chapitre. Pour la
clarté de votre script et votre facilité, on ne peut que
conseiller d'utiliser à chaque fois le mot var pour déclarer une
variable.
3.7 Les données sous Javascript
Javascript utilise 4 types de données :
Type |
Description |
|
|
Des nombres |
Tout nombre entier ou avec virgule tel que
22 ou 3.1416 |
Des chaînes de caractères
|
Toute suite de caractères comprise
entre guillemets telle que "suite de caractères" |
Des booléens |
Les mots true pour vrai et fase pour
faux |
Le mot null |
Mot spécial qui représente pas
de valeur |
Notons aussi que contrairement au
langage C ou C++, Il ne faut pas déclarer le type de données
d'une variable. On n'a donc pas besoin de int, float, double, char et autres
long en Javascript.
Nous allons employer la
méthode write() pour afficher des variables. On définit une
variable appelée texte qui contient une chaîne de
caractères "Mon chiffre préféré est le " et une
autre appelée variable qui est initialisée à 2.
<HTML>
<BODY> <SCRIPT LANGUAGE="Javascript"> <!-- var
texte = "Mon chiffre préféré est le " var variable =
2 document.write(texte + variable); //--> </SCRIPT>
</BODY> </HTML>
Le résultat se présente comme suit
:
Mon chiffre
préféré est le 2
3.8 Les noms réservés
Les mots de la liste ci-après
ne peuvent être utilisés pour des noms de fonctions et de
variables. Certains de ces mots sont des mots clés Javascript, d'autres
ont été réservés par Netscape pour un futur usage
éventuel.
A |
abstract |
B |
boolean break byte |
C |
case catch char class const continue
|
D |
default do double |
E |
else extends |
F |
false final finally float for function
|
G |
goto |
I |
if implements import in instanceof int
interface |
L |
long |
N |
native new null |
P |
package private protected public |
R |
return |
S |
short static super switch synchronized
|
T |
this throw throws transient true try
|
V |
var void |
W |
while with |
3.9 Variables globales et variables locales
Les variables
déclarées tout au début du script, en dehors et avant
toutes fonctions, seront toujours globales, qu'elles soient
déclarées avec var ou de façon contextuelle. On pourra
donc les exploiter partout dans le script.
Dans une fonction, une variable
déclarée par le mot clé var aura une portée
limitée à cette seule fonction. On ne pourra donc pas l'exploiter
ailleurs dans le script. D'où son nom de locale. Par contre, toujours
dans une fonction, si la variable est déclarée contextuellement
(sans utiliser le mot var), sa portée sera globale. |