 |
Jeudi 25 avril 2024 - 10:50 |
| Translate |
|
| Rubriques |
| Réseaux sociaux |
|
| Liste des jeux Amiga |
|
| Trucs et astuces |
|
| Glossaire |
|
| Galeries |
|
| Téléchargement |
|
| Liens |
|
| Partenaires |
|
| A Propos |
|
| Contact |
|
|
|
Nous allons découvrir au fil de cette série comment quelques lignes de JavaScript peuvent être utilisées dans votre site Web. Le JavaScript n'étant qu'une "amélioration", tous les navigateurs pourront lire vos pages mais seuls ceux qui sont compatibles JavaScript utiliseront vos spécifications.
Le JavaScript c'est quoi ?
Contrairement à ce que pense beaucoup de monde, le JavaScript et le Java n'ont rien en commun. Le JavaScript est un langage interprété dont on glisse quelques lignes de code dans une page HTML afin de la rendre plus vivante, alors que le Java est un langage objet qui permet de développer des applications entières.
Le premier script
|
<HTML> <HEAD> <TITLE>Le premier Script</TITLE> </HEAD> <BODY> <SCRIPT language="JavaScript"> <!-- On cache le code pour les navigateurs qui ne connaissent pas le JavaScript document.write("Notre tout premier script") // fin du script --> </SCRIPT> </BODY> </HTML> |
Examinons de plus près les différentes sections de cette page. Passons sur les balises HTML, que vous maîtrisez déjà parfaitement, pour disséquer le script proprement dit. Tout script (quel que soit son langage) commence par <SCRIPT ...> et se termine par </SCRIPT>.
SCRIPT language="argument" : argument prends ici la valeur "JavaScript". En effet, certains navigateurs peuvent prendre en charge d'autres langages tel que Visual Basic Script ou ActiveX.
Ensuite vient le corps du script encadré par une balise de début <!-- et une balise de fin --> qui cachent le corps du script aux navigateurs incapables de l'exécuter correctement.
Ici le corps se compose d'une seule instruction : document.write("Notre tout premier script") qui affiche sur un page HTML vierge :
| Notre tout premier script |
Attention, nous ne sommes pas en C, donc pas de point-virgule à la fin de la ligne.
Tout semble statique, quel avantage par rapport au HTML ? Pour l'instant ce petit script effectue la même chose que <P>Notre tout premier script <P> mais le JavaScript est un langage de programmation (simplifié certes) et non de description comme le HTML. Il faudra donc étoffer cette commande pour y voir une utilité.
Les fonctions et JavaScript
De là vient l'utilité des fonctions car tout langage de programmation se doit de pouvoir réagir aux événements de l'utilisateur.
|
<HTML> <HEAD> <TITLE>Réagir à une action</TITLE> <SCRIPT> function bonjour() { alert("Bonjour à tous !") } </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" VALUE="Cliquez ici" onclick="bonjour()"> </FORM> </BODY> </HTML> |
Nous ne nous occuperons pas de la balise <FORM>...</FORM> qui permet de créer un bouton à cliquer (Denis Bucher le développera plus tard). Dans ce script nous avons créé une fonction bonjour(). Cette fonction n'est pas exécutée lors du chargement de la page HTML mais seulement lors d'un clic sur le bouton "Cliquez ici". En effet, l'événement onclick appelle la fonction bonjour() qui ouvre un boîte d'alerte avec le message : Bonjour à tous ! (figure 1). Par contre, sous Voyager, qui ne reconnaît pas le JavaScript, seul le bouton est affiché. Le JavaScript ne pollue pas notre page HTML (figure 2).
Notre fonction affiche une boîte de dialogue, mais pour l'instant il n'est pas possible de réagir à tout événement sans écrire une pléiade de fonctions. Il faut donc écrire du code réutilisable. Il sera possible de réutiliser du code à condition de concevoir des fonctions "génériques" réagissant à des arguments tout comme dans les langages de haut niveau.
|
<HTML> <HEAD> <TITLE>Réagir à une action sans multiplier le nombre de fonctions</TITLE> <SCRIPT> function bonjour(argument) { alert(argument) } </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" VALUE="Bonjour" onclick="bonjour('Bonjour à tous')"> <INPUT TYPE="button" VALUE="A bientôt" onclick="bonjour('A bientôt')"> </FORM> </BODY> </HTML> |
On se rend compte que le JavaScript ressemble a du C interprété adapté à Internet. Ainsi, tout comme en C, il est possible de mettre plusieurs arguments séparés par une virgule.
C'est sympa mais que fait-on avec ?
Dans le présent article je vous ai présenté quelques fonctionnalités de JavaScript afin de vous donner un avant-goût de ce que l'on peut créer. A partir du mois prochain, nous nous plongerons plus en avant dans les objets reconnus par JavaScript ainsi que les structures de test. Nous suivrons la ligne tracée par mon collègue Denis Bucher. Nous verrons donc l'objet document et ce qui concerne les images.
|
