Chapitre 2 Le Javascript minimum pour
commencer
Pour apprendre et exploiter le Javascript, il vous
faut :
1. un browser qui reconnaît le Javascript,
2. une solide connaissance du Html,
3. un simple éditeur de
texte.
2.1 Un browser compatible Javascript
Uniquement Netscape et Microsoft
vous proposent des navigateurs "Javascript enabled". Pour Microsoft à
partir de MSIE Explorer 3.0 et Netscape à partir de Netscape Navigator
2.0.
Par contre, il faut être
attentif aux versions de Javascript exploitées par ces browsers.
|
Netscape 2.0 |
Javascript (baptisé à
posteriori 1.0) |
|
Netscape 3.0 |
Javascript 1.1 |
|
Netscape 4.0 |
Javascript 1.2 |
|
Explorer 3.0 |
Quelque chose qui ressemble à du
Javascript 1.0 |
|
Explorer 4.0 |
Javascript 1.2 |
2.2 Un bon éditeur de texte
Comme le code du Javascript vient
s'ajouter au code HTML, une connaissance approfondie des balises HTML est
souhaitable sinon indispensable. Une page HTML n'est que du texte. Le code
Javascript n'est lui aussi que du texte. Quoi de plus simple qu'un
éditeur de texte comme Notepad pour inclure votre Javascript dans votre
page HTML. De plus en plus d'éditeurs HTML whsiwyg proposent une
fenêtre Javascript.
2.3 La balise <SCRIPT>
Le langage HTML utilise des tags ou
balises pour dire au browser d'afficher une portion de texte en gras, en
italique, etc. Dans la logique du langage HTML, il faut donc signaler au
browser par une balise, que ce qui suit est un script et que c'est du
Javascript. C'est la balise <SCRIPT LANGUAGE="Javascript">. De
même, il faudra informer le browser de la fin du script. C'est la balise
</SCRIPT>.
Il vous sera peut-être utile
d'inclure des commentaires personnels dans vos codes Javascript. C'est
même vivement recommandé comme pour tous les langages de
programmation.
Javascript utilise les conventions
utilisées en C et C++ soit
// commentaire
Tout ce qui est écrit entre
le // et la fin de la ligne sera ignoré.
Il sera aussi possible d'inclure des
commentaires sur plusieurs lignes avec le code
/* commentaire sur
plusieurs lignes */
Ne confondez pas les commentaires
Javascript et les commentaires HTML ( <!-- ...--> ).
Les commentaires peuvent vous
être d'une utilité certaine en phase de débuggage d'un
script pour isoler sans effacer une ligne suspecte. Les commentaires ne peuvent
être imbriqués sous peine de message d'erreur.
Les browsers qui ne comprennent pas
le Javascript ignorent la balise <script> et vont essayer d'afficher le
code du script sans pouvoir l'exécuter. Pour éviter l'affichage
peu esthétique de ses inscriptions cabalistiques, on utilisera les
balises de commentaire du langage HTML <!-- ... -->.
Votre premier Javasript ressemblera à ceci :
<SCRIPT
LANGUAGE="javascript">
<!-- Masquer le script pour les anciens
browsers
...
programme Javascript
...
// Cesser de masquer le
script -->
</SCRIPT>
2.4 Où inclure le code en Javascript ?
Le browser traite votre page HTML de
haut en bas. Par conséquent, toute instruction ne pourra être
exécutée que si le browser possède à ce moment
précis tous les éléments nécessaires à son
exécution. Ceux-ci doivent donc être déclarés avant
ou au plus tard lors de l'instruction.
Pour s'assurer que le programme
script est chargé dans la page et prêt à fonctionner
à toute intervention de votre visiteur on prendra l'habitude de
déclarer systématiquement (lorsque cela sera possible) un maximum
d'éléments dans les balises d'en-tête soit entre
<HEAD> et </HEAD> et avant la balise <BODY>. Ce sera le cas
par exemple pour les fonctions. Rien n'interdit de mettre plusieurs scripts
dans une même page HTML.
Il faut noter que l'usage de la
balise script n'est pas toujours obligatoire. Ce sera le cas des
événements Javascript (par exemple onClick) où il faut
simplement insérer le code à l'intérieur de la commande
HTML comme un attribut de celle-ci. L'événement fera appel
à la fonction Javascript lorsque la commande HTML sera activée.
Javascript fonctionne alors en quelque sorte comme une extension du langage
HTML.
2.5 Votre première page HTML avec du
Javascript
Sans vraiment entrer dans les
détails, voyons une première instruction Javascript soit
l'instruction alert().
alert("votre texte");
Cette instruction affiche un message
dans une boite de dialogue pourvue d'un bouton OK. Pour continuer dans la page,
le lecteur devra cliquer ce bouton. Remarquerez les points-virgules à la
fin de chaque instruction Javascript. Le Javascript est moins strict que ces
autres langages et ne signale généralement pas de message
d'erreur s'ils venaient à manquer. On peut considérer que le
point-virgule est optionnel et qu'il n'est obligatoire que lorsque vous
écrivez plusieurs instructions sur une même ligne. Il est
recommandé quand même vivement dans la littérature d'en
mettre de façon systématique.
Javascript n'est pas toujours trop
strict sur la syntaxe et passe au-dessus de certaines libertés prises
avec celle-ci. Mais ce caractère est à double tranchant car
parfois, pour une raison indéterminée, il devient dans certaines
situations plus rigoureux et alors bonne chance pour débugger votre
script.
<HTML>
<HEAD>
<TITLE>Mon premier Javascript</TITLE>
</HEAD>
<BODY>
Bla-bla en HTML
<SCRIPT LANGUAGE="Javascript">
<!--
alert("votre texte");
//-->
</SCRIPT>
Suite bla-bla en HTML
</BODY>
</HTML>
Javascript est case sensitive.
Ainsi il faudra écrire alert() et non Alert(). Pour
l'écriture des instructions Javascript, on utilisera l'alphabet ASCII
classique comme en HTML. Les caractères accentués comme é
ou à ne peuvent être employés que dans les chaînes de
caractères. Les guillemets " et l'apostrophe ' font partie
intégrante du langage Javascript. On peut utiliser l'une ou l'autre
forme à condition de ne pas les mélanger. Ainsi alert("...')
donnera un message d'erreur. Si vous souhaiter utiliser des guillemets dans vos
chaînes de caractères, tapez \" ou \' pour les différencier
vis à vis du compilateur.
La petite fenêtre est à
utiliser avec parcimonie pour attirer l'attention du lecteur pour des choses
importantes. Javascript met à votre disposition la possibilité de
créer de nouvelles fenêtres de la dimension de votre choix qui
apparaissent un peu comme les popup des fichiers d'aide.
Alert() est une méthode de
l'objet Window. Pour se conformer à la notation classique
nom_de_l'objet.nom_de_la_propriété, on aurait pu noter
window.alert(). Window venant en tête des objets Javascript, celui-ci est
repris par défaut par l'interpréteur et devient en quelque sorte
facultatif. Si vous souhaitez que votre texte de la fenêtre alert()
s'inscrive sur plusieurs lignes, il faudra utiliser le caractère
spécial /n pour créer une nouvelle ligne.
2.6 Versions du langage Javascript
Avec les différentes versions
déjà existantes, on peut imaginer des scripts adaptés aux
différentes versions mais surtout aux différents navigateurs:
<SCRIPT
LANGUAGE="Javascript">
// programme pour Netscape 2 et Explorer 3
var version="1.0";
</SCRIPT>
<SCRIPT
LANGUAGE="Javascript1.1">
// programme pour Netcape 3 et Explorer 4
var version=1.1;
</SCRIPT>
<SCRIPT
LANGUAGE="Javascript1.2">
// programme pour Netscape 4
var
version=1.2;
</SCRIPT>
<SCRIPT
LANGUAGE="Javascript">
document.write('Votre browser supporte le
Javascript ' + version);
</SCRIPT> |
