Scribd
Importer
6 vues3 pages

TP 1 Javascript

Ce document présente un TP sur l'intégration de scripts JavaScript dans des documents HTML, avec des exercices pratiques pour afficher des messages, créer des formulaires et gérer des événements. Les exercices incluent l'affichage de messages, la création de formulaires, et la gestion d'événements tels que le chargement de la page et les clics. Des questions sont également posées sur le comportement du code JavaScript et son interaction avec le HTML.

Transféré par

salma.toumi
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
6 vues3 pages

TP 1 Javascript

Ce document présente un TP sur l'intégration de scripts JavaScript dans des documents HTML, avec des exercices pratiques pour afficher des messages, créer des formulaires et gérer des événements. Les exercices incluent l'affichage de messages, la création de formulaires, et la gestion d'événements tels que le chargement de la page et les clics. Des questions sont également posées sur le comportement du code JavaScript et son interaction avec le HTML.

Transféré par

salma.toumi
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
Vous êtes sur la page 1/ 3

ISGI

LAAYOUNE Programmer en JavaScript


TP N° 1

Formateur : BENSALEM Yassine


Intégration d’un script JavaScript
Dans un document html
 Le script JavaScript: alert (‘bonjour’) permet d’afficher le message bonjour dans une boite
de dialogue
 La méthode getElementById() de Document renvoie un objet Element représentant
l'élément dont la propriété id correspond à la chaîne de caractères spécifiée
 Le script JavaScript: document.write (‘bonjour’) permet d’afficher le message bonjour dans
une page html

Exercice 1 :
Écrivez un script qui affiche le message "développement digital " sur la page.

Exercice 2 :
Écrivez un script qui affiche un formulaire avec un champ texte. Écrivez ensuite dans ce champ le
message "Vous avez réussi votre exercice".

Exercice 3 :
Développer une page web qui affiche une boite de dialogue avec un message bonjour

1. au chargement de la page web :


 En intégrant le script dans le corps de la page web
 En utilisant un fichier externe
2. Au passage de la souris sur le lien (événement onMouseover)
3. En cliquant sur un bouton (événement onclick)
Exercice 4 :
Question 1 : Créer le document à partir du code source fourni ci-dessous. Quelle est l’extension à
donner à ce document ?

Question 2 : Tester dans un navigateur. Pourquoi le texte écrit en HTML ne s’affiche-t-il pas tout
de suite ?
Question 3 : Comment appelle-t-on le type de boîte de dialogue utilisé dans cet exemple ?
Question 4 : Que se passe-t-il si on place le code javascript après le texte écrit en HTML ?

Exercice n°4.2 : code javascript externe au document


Question 5 : Reprendre l’exemple précédent mais en plaçant le script dans un fichier externe
script1.js. Tester dans un navigateur.

Exercice n°4.3 : code javascript dans des balises HTML


Question 6 : Afficher une boîte de dialogue modale lorsqu’on clique sur un lien. Le texte à afficher
sera : « Vous venez de cliquer sur un lien ! ».

Exercice n°4.4 : gestionnaire d’évènement en javascript


Question 7 : Créer le document à partir du code source fourni ci-dessous

Question 8 : Quel est le nom de l’évènement géré ici par le code javascript ? Tester dans un
navigateur. Que se passe-t-il lors du chargement de la page dans un navigateur ?

Question 9 : Modifier l’exemple précédent pour qu’une boîte de dialogue modale affiche « À
bientôt ! » lorsqu’on quitte la page. Quel est alors le nom de l’évènement à gérer ? Tester dans un
navigateur le changement produit.
Exercice 5 :
Vous avez une page avec un formulaire et un champ. Écrivez un script qui va valider le formulaire.
Si le champ est vide, un message d'erreur est affiché à côté du champ et le formulaire n'est pas
envoyé. Si le champ contient des données, le formulaire peut être envoyé.

Vous aimerez peut-être aussi