Programmation Javascript (NFA041)

Dans ces premier exercices (très basiques !), pour simplifier les choses on positionne le gestionaire d’événement dans le code html, par l'attribut onclick.

A partir de l'exercice 6 essayez de le faire depuis javascript en utilisant addEventListener.

Dans les premiers exercices on demande l'affichage part alert mais vous pourrez essayer dans un second temps, éventuellement après les feuilles d'exercices suivantes, de re-faire ces exercices avec un affichage dans une zone prevue, voir de créer la zone d'affichage dynamiquement.

Exercice 1

On a le code HTML suivant :

<label for="m1">mois : </label>
<input type="text" id="m1" />
<p><button onclick="verifMois()">vérifier</button></p>

On a un champ texte (d'id "m1") demandant un numéro de mois (1=janvier, ... 12=décembre), vérifiez si son contenu est correct ou pas. On affichera le résultat dans un alert().

Exercice 2

On a deux champs texte qui contiennent le score du joueur 1 et le score du joueur 2. Écrire le formulaire et faire un programme qui affiche qui a gagné. On affichera le résultat dans un alert().

Exercice 3

On veut calculer le poids idéal d'une personne.

Pour cela, on doit avoir trois informations : sa taille T en cm, son âge A en années, et son sexe S (qui sera donné par un champ texte dans lequel on écrira "homme" ou "femme").

La formule (complètement fantaisiste ! ) est :

• pour un homme : (3*T-250)*(A+270)/1200
• pour une femme : (T/2 -30 )*(180+A)/200

Écrire le html correspondant, ainsi que le code javascript.

On affichera le résultat dans un alert().

Exercice 4

On a le code html :

<p>nombres <input type="text" id="nbr" /></p>
<p><button onclick="calcuSommel()">vérifier</button></p>

Dans le champ texte on saisira des nombres séparés par des espaces.

Calculez la somme des nombre entrés.

Calculez leur moyenne avec un autre bouton.

Exercice 5

On a deux champs texte. Dans le premier on entre un texte et dans le second on entre un caractère. Écrire une fonction qui affiche vrai si le caractère est compris dans le texte et faux sinon.

On n'utilisera pas indexOf, mais on écrira une boucle en utilisant la méthode charAt().

Exercice 6

On veut écrire un petit programme javascript permettant de calculer un produit. L'utilisateur saisira les valeurs à ajouter dans deux champs :

Exemple :

x =

calculer !

1. Écrire le programme en supposant que le résultat est montré en utilisant un troisième champ de saisie de texte (input)

2. Écrire le programme en supposant que le résultat est montré dans une div prevue a cet effet (il n'y a donc pas de 3em input mais un div)

   1. en utilisant innerHTML
   2. en utilisant la méthode textContent du noeud div

3. Modifier le code de la question 2.b pour que le résultat s'affiche en rouge.

4. Modifier le code de la question 3 pour que le résultat soit sur fond vert si il est plus petit que 10, et sur fond jaune sinon.

5. Modifier le code de la question 4 pour que si le résultat est un NaN un message s'affiche sur fond rose en haut à droite de l'écran