Médiaforma

Première approche du JavaScript

Print Friendly

Cliquez ici pour accéder au pack eBook+vidéos HTML5, CSS3, JavaScript

Le langage JavaScript met de la vie dans vos pages HTML. Il est en effet capable de réagir aux actions de l’utilisateur (clic, survol, frappe clavier, etc.) en exécutant du code côté client, c’est-à-dire sur l’ordinateur où s’affiche la page Web.

Dans cette rubrique, vous allez faire une première approche très light du langage HTML. Je vais vous montrer comment afficher une boîte de message lorsque l’utilisateur clique sur un bouton.

Entre les balises <head> et </head>, la balise <script> indique que les lignes qui vont suivre sont du code actif. L’attribut language précise qu’il s’agit de code JavaScript. La balise </script> délimite la fin du code JavaScript.

La ligne 5 définit la fonction popup(). Les instructions qui composent cette fonction se trouvent entre des accolades. Ici, la fonction popup() ne contient qu’une seule instruction, ligne 7.

Cette instruction affiche un texte dans une boîte de message en utilisant la fonction prédéfinie alert(). Le texte affiché se trouve à l’intérieur des parenthèses, encadré par des apostrophes.

Pour invoquer la fonction popup(), nous allons utiliser un événement lié à une balise HTML.

Le corps du document définit un formulaire (lignes 12 à 14). Ce formulaire contient un seul élément défini ligne 13. Ici, il s’agit d’un simple bouton. Le texte affiché dans le bouton est défini dans l’attribut value. Quant à l’attribut onClick, il fait référence à la fonction JavaScript popup(). Vous l’aurez compris, la fonction popup() sera exécutée lorsque l’utilisateur cliquera sur le bouton.

Exécutez ce code dans un navigateur. Le code JavaScript est détecté par Internet Explorer et un message d’avertissement apparaît dans la partie inférieure de la fenêtre. Confirmez que vous voulez exécuter ce code en cliquant sur Autoriser le contenu bloqué.

Remarque

Ce message d’alerte s’affiche parce que le code JavaScript est exécuté localement. Si vous placez le fichier HTML sur un serveur Web, aucun message d’alerte ne sera affiché.

Cliquez sur le bouton Cliquez ici. Une fenêtre de message contenant le message spécifié dans la fonction popup() est affiché :

Vous avez aimé cet article ? Partagez-le avec vos réseaux...
 
Comments

No comments yet.

Leave a Reply