Explorer les Livres électroniques
Catégories
Explorer les Livres audio
Catégories
Explorer les Magazines
Catégories
Explorer les Documents
Catégories
TD Javascript
Transféré par
Braxt MwIra GibecièreDescription :
Copyright
Formats disponibles
Partager ce document
Partager ou intégrer le document
Avez-vous trouvé ce document utile ?
Ce contenu est-il inapproprié ?
Signaler ce documentDescription :
Droits d'auteur :
Formats disponibles
TD Javascript
Transféré par
Braxt MwIra GibecièreDescription :
Droits d'auteur :
Formats disponibles
TD JAVASCRISPT 2017-2018
EXERCICES JAVASCRIPT ET FORMULAIRE
Question 1 :
Ecrivez le texte Mon premier exercice javascript dans la page
Question 2 :
Affichez le texte Mon premier exercice javascript dans une bote alerte ?
Question 3 : calcul de la surface dune cercle
Effectuez le calcul de la surface dun cercle (3.1416 * r2) o le rayon est gal 3
Question 4 : Bote dinvite + boucle
Ralisez le calcul de la surface dun cercle (3.1416 * r2) dun rayon fournit par lutilisateur dans une
bote dinvite (prompt).. On souhaite par contre afficher 10 valeurs.
valeur
Question 4 bis : Du HTML en Javascript
Afficher dans la page : Cours de Javascript BTS SNIR comme titre <h1> et
Appliquons du style avec JS en normal, gras et italique
Question 5 : Concatnation
Ecrivez par une seule instruction document.write, la variable chaine1 = vive le suivi de la variable
chaine2 = Javascript
Question 5 bis : fonction
Affichez un boite dalerte par un bouton.
bouton. Le clic sur ce dernier appellera une fonction qui dclenchera
la bote dalerte.
Indice : Utiliser onClick
1
TD JAVASCRISPT 2017-2018
Question 6 : Fonction Prix en ligne
Soit deux zones de texte destines lencodage des quantits du prix unitaire. Calculez le prix hors
TVA et le prix TVA incluse (19.6%). Les rsultats sont renvoys dans des zones de texte au clic sur le
bouton calculer.
Indice : Pour larrondi 2 chiffres aprs la virgule, utiliser y = Math.round(y*100)/100.
Question 7 : Convertisseur euro
Elaborez un convertisseur Dollars Euro comme illustr par la capture dcran.
Indice : Supposons que le montant en euro sobtient en divisant le dollars par 1.2 et le montant en euro
multipliant par 1.2. Pour larrondi 2 chiffres aprs la virgule, utiliser y = Math.round(y*100)/100.
Question 8 : conditions if()..else
Soit une zone de texte complter par lutilisateur. Vrifiez que la rponse est correcte (ici le mot
algorithme). Un texte validant ou pas la rponse sera affiche dans une bote dalerte
Question 9 : Table de multiplication
Affichez la table de multiplication du nombre saisi par lutilisateur dans une bote dinvite.
Indice : la bote dinvite est ralise par la mthode prompt ( ).
2
TD JAVASCRISPT 2017-2018
Gestionnaire Dvnement
Question 10 : Evnement onSelect
Affichez une bote dalerte la slection dun mot dans une zone de texte
Question 11 : Evnement onFocus
Affichez le texte Votre email ici ! , lorsquune zone de texte reoit le focus (llment de lobjet
devient actif )
Question 12 : Evnement onUnload
Affichez une vos remerciements dans une bote dalerte lorsque le visiteur quitte la page.
3
TD JAVASCRISPT 2017-2018
Question 13 : Evnement onReset
Affichez le texte Ceci effacera les donnes dans une bote dalerte lorsque le visiteur clique
cliqu sur le
bouton dannulation (reset).
Question 14: Evnement onKeyUp
Affichez dans une bote dalerte, aprs chaque lettre (venement onKeyUp), le texte encod dans une
zone de texte
Question 15 : Evnement onMouseOver
Affichez une autre image au survol du curseur dune image initiale. Indice : on utilise les proprits
onmouseover et onmouseout.
Solution :
<!DOCTYPE html>
<html>
<head>
<title>exemple 13</title>
<meta charset="utf-8">
</head>
<body>
<a href="#" onMouseover ="document.image1.src='bleu_down.gif'" onmouseout
="document.image1.src='bleu_up.gif'">
<img name ="image1" src="bleu_up.gif" alt="" border="0"></a>
</body>
</html>
Formulaires
Exercices 1 : Attribuer ou annuler une valeur
Au clic, affichez ou annulez une valeur saisie dans une ligne de texte
4
TD JAVASCRISPT 2017-2018
Exercice 2 : Annuler une valeur par defaut
Annuler une valeur par dfaut, au focus dune zone de texte
Exercice 3 : Tester un formulaire vide
Affichez une bote dalerte lors de lenvoi dun formulaire comportant une ligne de texte reste vide
Exercice 4 : Retrouver la valeur dun bouton radio
Retournez dans une ligne de texte, le choix effectu par des boutons de choix unique (bouton radio).
Exercice 5 : Retrouver la valeur dun bouton checkbox
Retournez dans une ligne de texte, le choix effectu par des boutons de choix multiple (boutons
checkbox)
5
TD JAVASCRISPT 2017-2018
Exercice 6 : Retrouvez la valeur dun select
Retrouvez dans une ligne de texte, le choix effectu par un menu droulant (bouton select)
Exercice 7 : QCM sous forme de boutons radio
Concevez un questionnaire avec des boutons de choix unique (radio). Au clic sur le bouton Vrfier,
affichez dans une bote dalerte si la rponse est bonne ou fausse.
Indice : Utiliser lattribut chekcked des boutons radio pour trier les rponses.
Exercice 8 : QCM sous forme de cases cocher
Concevez un questionnaire avec des boutons de choix unique (checkbox). Au clic sur le bouton
Vrfier, affichez dans une bote dalerte si la rponse est bonne ou fausse.
Exercice 9 : QCM qui affiche le rsultat
Concevez un questionnaire avec des boutons de choix unique (radio). Au clic sur le bouton Vrfier,
affichez dans une zone de texte, le nombre de rponses correctes. Au clic sur le bouton Recommencer,
rinitialisez blanc le questionnaire.
6
TD JAVASCRISPT 2017-2018
Exercice 10 : QCM Chronomtr
Concevez un questionnaire avec des boutons de choix unique(radio). Le temps de rponse est limit
10 secondes. Au clic sur un bouton radio, affichez dans une bote dalerte le rsultat et ventuellement,
si le temps allou est coul.
Indice : la minuterie est implante par une instruction setTimout qui sactualise toutes les secondes.
Suite des questions :
Question 16 : Utilisation de getElementById
Soit un formulaire illustr par la capture dcran suivante. Les zones de texte sont dfinies par un
identifiant Id. Au clic sur le bouton Reproduire, renvoyez la valeur des boutons de choix
unique(radio) dans la zone de sortie en utilisant la mthode getElementById
7
TD JAVASCRISPT 2017-2018
Question 17 : Utilisation de getElementsByName
Reprenons le mme formulaire que la question 16. Les lments du formulaire sont dfinis par un
identifiant name. Au clic sur le bouton Reproduire, renvoyez la valeur des boutons de choix unique
(radio) dans la zone de sortie en utilisant la mthode getElementByName.
Question 18 : Utilisation de getElementsByTagName
Reprenons le mme formulaire de la question 17. Au clic sur le bouton Reproduire, renvoyez la
valeur des boutons de choix unique (radio) dans la zone de sortie en utilisant la mthode
getElementsByTagName.
Question 19 : Nombre dlments dun formulaire
Avec le mme formulaire de la question 18, au clic sur le lien affich, indiquez dans une bote dalerte
le nombre dlments du formulaire
Indice : Utiliser la propit getElementsByTagName
