Exercices les fonctions en javascript
Exercices les fonctions en javascript
-
Objectifs
- Etre capable de bien utiliser les fonctions en javascript
-
Exercice 01
-
Énoncé
- Créer un script javascript qui affiche une boîte de dialogue de saisie avec le message suivant : "Entrez une année sous forme YYYY :".
- Le script testera si l’année est sous la forme "YYYY" ou non, si c’est le cas (annee n’est pas sous la forme YYYY) le script redemande à l’utilisateur de saisir de nouveau l’année, jusqu’à une saisie correcte
- Le script testera ensuite si l’année "YYYY" saisie par l’utilisateur est une année bissextile. Pour cela, Ecrire une fonction EstBissextile() qui :
- Reçoit en argument l’année à tester
- Retourne vrai dans le cas où l’année est bissextile sinon faux.
- Le résultat doit être affichée dans la page HTML du résultat du test : "YYYY est une année bissextile" avec une couleur verte ou "YYYY n’est pas une année bissextile" avec une couleur rouge.
- Éditer le document HTML htmlbissextile.html et le script dans un fichier externe jsbissextile.js.
- La page html gardera la saisie jusqu’au rechargement.
-
Solution
-
Exercice 02
-
Énoncé
- Créez une page web multiplication.html qui contiendra un formulaire. Ce formulaire contiendra deux champs de texte et un bouton de soumission.
- Il faudra faire en sorte que lorsque le formulaire est soumis, la page courante soit rechargée. Sous le formulaire, si celui-ci a été soumis, vous afficherez un tableau contenant les tables de multiplication.
- Les tables auront m lignes et n colonnes, où m est la valeur du premier champ du formulaire, et n est la valeur du deuxième champ du formulaire (avant soumission).
- Si les valeurs des champs de texte du formulaire ne sont pas des entiers, vous afficherez une erreur (indice : vous pouvez utiliser la fonction
is_integer()
). - Faites en sorte que les cellules de votre tableau HTML aient une vue Bootstrap4.
- Vous n’utiliserez pas de PHP ; uniquement du HTML, du Bootstrap (CSS) et du JavaScript.
- Votre page pourra par exemple ressembler à ceci :
-
Solution
- Essayez de faire l’exercice de votre côté avant de regarder la solution !
-
Exercice 03
-
Énoncé
- Créer la page suivante à l’aide du langage HTML5 (utilisez les balises de body, div, h1, h2, p, fieldset, legend, form, select, hr, input, br, etc.) et l’enregistrer sous le nom exercice03.html
- Créer le formulaire ci-contre.
- Améliorer le style et mise en forme de la page avec le langage CSS. Il est conseillé d’utiliser un fichier CSS externe, appelé depuis l’entête de votre page html
- On vous demande de créer une fonction dans un fichier JS externe en JavaScript, qui en cliquant sur le bouton Calculer, permet de calculer :
- Montant HT et le Total TTC sachant que :
- Montant HT = Quantité * Prix HT
- Total HT = Montant HT * 1.1 ( si TVA=10%)
- ou Total HT = Montant HT * 1.5 ( si TVA=15%)
- Dans notre, cas tous les champs sont obligatoires, Adapter la fonction afin de vérifier la présence de tous les champs.
- Ajoutez une deuxième fonction qui vous permet d’initialiser le formulaire après click sur le bouton « Effacer »
-
Solution
- Essayez de faire l’exercice de votre côté avant de regarder la solution !
-
Exercice 04
-
Énoncé
- Dans une page HTML créer une zone de texte suivi d’un bouton
- Écrire une fonction javascript qui vérifie si le contenu du zone de texte est un palindrome ou non, indépendamment de cas et des espaces
- On rappelle qu’une chaîne de caractères, un mot, une phrase, un nombre ou une autre séquence d’unités est dite palindrome, si elle se lit de la même manière dans les deux sens. Exemple: non, touot et 1234321 sont toutes des chaînes de caractères palindromes.
-
Solution
- Essayez de faire l’exercice de votre côté avant de regarder la solution !
-
Exercice 05
-
Énoncé
- Dans une page HTML écrire un script JavaScript qui affiche une boîte de dialogue de saisie avec le message suivant : « Entrez une année : ».
- Il vous faut tester si l’année saisie par l’utilisateur est une année bissextile. Pour cela, vous devez écrire une fonction isAnneeBissextile() qui :
- reçoit en argument l’année à tester
- retourne vrai (true) dans le cas où l’année est bissextile sinon faux (false).
- L’affichage indiquera le résultat du test : « 20xx est une année bissextile » ou « 20xx n’est pas une année bissextile ».
- Remarque :
- La méthode window.prompt(texte, texte_par_défaut) ouvre une boîte de dialogue dotée d’une zone de saisie et retourne les données saisies par l’utilisateur.
-
Solution
- Essayez de faire l’exercice de votre côté avant de regarder la solution !
-
Essayez de faire l’exercice de votre côté avant de regarder la solution !