الرئيسية
اااااا أهلا وسهلا بكم وبجميع الزوار لمنتدانا أحلى أحلام شرفتم 
من طرف Chapitre 5 : Le Javascript minimum
5.1 La balise <SCRIPT>
De ce qui précède, vous savez déjà que votre script vient s'ajouter à votre page Web.
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 (et non du VBScript). 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>.
5.2 Les commentaires
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 (mais qui le fait vraiment ?).
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 (pour rappel <!-- ...-->).
5.3 Masquer le script pour les anciens browsers
Les browsers qui ne comprennent pas le Javascript (et il y en a encore) 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>
5.4 Où inclure le code en Javascript ?
Le principe est simple. Il suffit de respecter les deux principes suivants :
- n'importe où.
- mais là où il le faut.
Le browser traite votre page Html de haut en bas (y compris vos ajoutes en Javascript). 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 (il y a des impatients) 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.
5.5 Une première instruction Javascript
Sans vraiment entrer dans les détails, voyons une première instruction Javascript (en fait une méthode de l'objet window) soit l'instruction alert().
alert("votre texte");
Cette instruction affiche un message (dans le cas présent votre texte entre les guillemets) dans une boite de dialogue pourvue d'un bouton OK. Pour continuer dans la page, le lecteur devra cliquer ce bouton.
Vous remarquerez des points-virgules à la fin de chaque instruction Javascript (ce qui n'est pas sans rappeler le C et le C++).
5.6 Votre première page Html avec du Javascript
5.7 Remarques
Javascript est « case sensitive ». Ainsi il faudra écrire alert() et non Alert(). Pour l'écriture des instructions Javascript, on utilisera l'alphabet ASCII classique (à 128 caractères) comme en Html. Les caractères accentués comme é ou à ne peuvent être employés que dans les chaînes de caractères c.-à-d. dans votre texte de notre exemple.
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.
+5.8 Versions du langage Javascript
Avec les différentes versions déjà existantes (Javascript 1.0, Javascript 1.1 et Javascript 1.2), 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>
+5.9 Extension .js pour scripts externes
Il est possible d'utiliser des fichiers externes pour les programmes Javascript. On peut ainsi stocker les scripts dans des fichiers distincts (avec l'extension .js) et les appeler à partir d'un fichier Html. Le concepteur peut de cette manière se constituer une bibliothèque de script et les appeler à la manière des #include du C ou C++. La balise devient
<SCRIPT LANGUAGE='javascript' SRC='http://site.com/javascript.js'></SCRIPT>
+5.10 Toujours des commentaires
Outre les annotations personnelles, les commentaires peuvent vous être d'une utilité certaine en phase de débogage d'un script pour isoler (sans effacer) une ligne suspecte.
Pour les esprits compliqués, notons que les commentaires ne peuvent être imbriqués sous peine de message d'erreur. La formulation suivante est donc à éviter :
/* script réalisé ce jour /* jour mois */
et testé par nos soins*/
+5.11 Alert() ... rouge
Joujou des débutants en Javascript, cette petite fenêtre est à utiliser avec parcimonie pour attirer l'attention du lecteur pour des choses vraiment importantes. Et puis, elles ne sont vraiment pas destinées à raconter sa vie. 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. Nous les étudierons plus loin dans l'objet Window.
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.
5.1 La balise <SCRIPT>
De ce qui précède, vous savez déjà que votre script vient s'ajouter à votre page Web.
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 (et non du VBScript). 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>.
5.2 Les commentaires
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 (mais qui le fait vraiment ?).
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 (pour rappel <!-- ...-->).
5.3 Masquer le script pour les anciens browsers
Les browsers qui ne comprennent pas le Javascript (et il y en a encore) 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>
5.4 Où inclure le code en Javascript ?
Le principe est simple. Il suffit de respecter les deux principes suivants :
- n'importe où.
- mais là où il le faut.
Le browser traite votre page Html de haut en bas (y compris vos ajoutes en Javascript). 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 (il y a des impatients) 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.
5.5 Une première instruction Javascript
Sans vraiment entrer dans les détails, voyons une première instruction Javascript (en fait une méthode de l'objet window) soit l'instruction alert().
alert("votre texte");
Cette instruction affiche un message (dans le cas présent votre texte entre les guillemets) dans une boite de dialogue pourvue d'un bouton OK. Pour continuer dans la page, le lecteur devra cliquer ce bouton.
Vous remarquerez des points-virgules à la fin de chaque instruction Javascript (ce qui n'est pas sans rappeler le C et le C++).
5.6 Votre première page Html avec du Javascript
<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> | Html normal ... ... ... ... ... Début du script Masquer le script Script Fin de masquer Fin du script Html normal ... ... |
Javascript est « case sensitive ». Ainsi il faudra écrire alert() et non Alert(). Pour l'écriture des instructions Javascript, on utilisera l'alphabet ASCII classique (à 128 caractères) comme en Html. Les caractères accentués comme é ou à ne peuvent être employés que dans les chaînes de caractères c.-à-d. dans votre texte de notre exemple.
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.
+5.8 Versions du langage Javascript
Avec les différentes versions déjà existantes (Javascript 1.0, Javascript 1.1 et Javascript 1.2), 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>
+5.9 Extension .js pour scripts externes
Il est possible d'utiliser des fichiers externes pour les programmes Javascript. On peut ainsi stocker les scripts dans des fichiers distincts (avec l'extension .js) et les appeler à partir d'un fichier Html. Le concepteur peut de cette manière se constituer une bibliothèque de script et les appeler à la manière des #include du C ou C++. La balise devient
<SCRIPT LANGUAGE='javascript' SRC='http://site.com/javascript.js'></SCRIPT>
+5.10 Toujours des commentaires
Outre les annotations personnelles, les commentaires peuvent vous être d'une utilité certaine en phase de débogage d'un script pour isoler (sans effacer) une ligne suspecte.
Pour les esprits compliqués, notons que les commentaires ne peuvent être imbriqués sous peine de message d'erreur. La formulation suivante est donc à éviter :
/* script réalisé ce jour /* jour mois */
et testé par nos soins*/
+5.11 Alert() ... rouge
Joujou des débutants en Javascript, cette petite fenêtre est à utiliser avec parcimonie pour attirer l'attention du lecteur pour des choses vraiment importantes. Et puis, elles ne sont vraiment pas destinées à raconter sa vie. 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. Nous les étudierons plus loin dans l'objet Window.
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.
