1. Introduction
Commencons par un exemple amusant et instructif.
Je vous propose de jouer à une espèce de morpion : c'est
la machine contre vous. Votre but est d'obtenir cinq croix, et d'empêcher
l'ordinateur d'avoir cinq cercles à la suite. C'est 5-in-a-Row.
Ce jeu, dont le poids numérique, images inclut, n'est pas plus
que 5k, est programmé entièrement en javascript, par Steffen
Gerlach.
Si vous regardez le code source, très compact, de la page contenant
le jeu ... vous voyez que la plus grand partie du code se trouve dans
la partie 'head', délimité par les balises <script>
et </script>. C'est la définition
d'une fonction javascript, qui est activé
par l'événement 'onload' (à l'instant
du chargement de la page), et qui, en fait, s'occupe de l'écriture
de l'HTML de la page qui s'affiche dans votre navigateur, ainsi que des
changements de l'affichage selon le développement du jeu. Ce qui
inclut les reponses de l'ordinateur aux actions de l'utilisateur.
Javascript est un langage de programmation simple (mais limité), qui permet d'intégrer du code (les scripts) dans une page web (ou dans un fichier externe attaché à la page). Les scripts sont interpretés par le navigateur au moment leur exécution est demandée par un événement : quelque chose qui se passe avec le document, ou avec ou dans la fenètre navigateur qui affiche la page (par exemple: le pointeur de la souris qui passe sur un lien hypertexte). Javascript est un langage de script, c.a.d. un langage de programmation pour contrôler une application (en général: le navigateur web). La code source d'un script est executé directement, sans compilation en 'program' executable hors de l'application.
On ne doit surtout pas confondre javascript avec java, le langage de programmation orientée objet originaire de Sun Microsystems. Dans le développement des sites web on utilise parfois aussi java, mais pour la création de ce qu'on appelle des 'applets'. Là il s'agit des programmes java, dont le code source a été compilé bien avant l'affichage des applets dans le navigateur. Contrairement au Javascript, Java est un langage de programmation complet et complexe.
Javascript
a été inventé et developpé par Brendan Eich chez
Netscape (originalement sous le nom de 'Livescript'), et introduit avec
la version 2 de leur navigateur (en septembre 1995).
Peu après Netscape, aussi Microsoft introduisait un langage de
script 'côté client' dédié au web : le JScript.
Un interprétateur J(ava)script fait partie du navigateur MS Internet
Explorer depuis la version 3.
Il existe une version standardisée : ECMAscript, qui est basée sur javascript et Jscript (la syntaxe, les mots-clés et les composants natifs). (ECMA, acronym de European Computer Manufacturer Association, est le nom original d'un organisme fondé en 1961 et renommé ensuite 'European Association for Standardizing Information and Communication Systems'. ECMA s'occupe de standardiser des formats de données et des langages informatiques.)
2. Insérer un javascript dans une page web.
On peut mettre du code javascript dans une page web à 3 endroits. Le format d'insertion est à chaque fois différente.
- On peut insérer du javascript dans un élément
'script' dans la partie 'head' ou dans la partie 'body' de la page :
....(Le début de commentaire HTML avant les instructions javascript sert à éviter que le code javascript soit affiché comme texte par des outils qui ne savent pas interpréter le javascript. Le commentaire javascript après les instructions (
<script type="text/javascript">
<! --
... ici les instructions javascript ...
// -->
</script>
....
//) évite que la fin du commentaire HTML soit interpété comme du javascript ...)
Le code javascript ainsi inclus dans la partie 'head' est évalué au début du chargement de la page, mais n'est pas exécuté tout de suite. Par contre, si l'élémént 'script' se trouve dans la partie 'body', il est immédiatement exécuté, en même temps que le code HTML est interprété.
On inclut les déclarations de fonctions toujours dans la partie 'head', car les fonctions doivent être connues dès le chargement du document, mais ne doivent être exécutées que lors d'un appel explicite. - On peut associer un javascript à un élémént
de la page, en utilisant un attribut qui correspond à un événement.
Par exemple:
<img src="silver.gif" width="30" height="10" alt="ill" onmouseover="document.images['exemple'].src='red.gif';" onmouseout="document.images['exemple'].src='silver.gif';" />
Testez le script en survolant le petit rectangle colorié
... - On peut associer un javascript au pseudo-protocole javascript:
dans un élément 'a', comme valeur de l'attribut 'href'.
Exemple:
<a href="javascript:document.images['exemple'].src='blue.gif';"> Changez l'image </a>Pour tester le script: changez l'image ...
