Devoir pratique STI n°7 : la page du quiz du club, vérifier le code d'accès et corriger le quiz en JavaScript

Exercice 1 : le code d'accès (8 pts)

Le club informatique a la page de quiz quiz.html suivante, reliée au fichier quiz.js :

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="utf-8">
  <title>Quiz du club</title>
</head>
<body>
<h1>Quiz du club informatique</h1>
<form id="quiz">
  <label for="code">Code d'accès</label>
  <input type="text" id="code">
  <p>1) Quelle balise fait une liste numérotée ?</p>
  <input type="radio" name="q1" value="a" id="q1a"><label for="q1a">&lt;ul&gt;</label>
  <input type="radio" name="q1" value="b" id="q1b"><label for="q1b">&lt;ol&gt;</label>
  <p>2) Quelle propriété CSS change la couleur du texte ?</p>
  <input type="radio" name="q2" value="a" id="q2a"><label for="q2a">color</label>
  <input type="radio" name="q2" value="b" id="q2b"><label for="q2b">font-color</label>
  <p>3) Quelle méthode met un texte en majuscules ?</p>
  <input type="radio" name="q3" value="a" id="q3a"><label for="q3a">toUpper()</label>
  <input type="radio" name="q3" value="b" id="q3b"><label for="q3b">upper()</label>
  <input type="radio" name="q3" value="c" id="q3c"><label for="q3c">toUpperCase()</label>
  <input type="button" value="Corriger" onclick="corriger()">
</form>
<p id="score"></p>
<script src="quiz.js"></script>
</body>
</html>

Pour répondre au quiz, chaque membre du club tape son code d'accès de 6 caractères : deux lettres majuscules puis quatre chiffres, par exemple TN2026. Écrire dans quiz.js, en JavaScript, sans expression régulière :

• 1) la fonction nbChiffres(ch) qui renvoie le nombre de chiffres (de 0 à 9) du texte ch (4 pts) ;
• 2) la fonction codeValide(code) qui renvoie true si code a exactement 6 caractères, deux lettres majuscules (de A à Z) puis quatre chiffres ; sinon false (4 pts).

Exemples : nbChiffres("TN2026") donne 4, codeValide("TN2026") donne true, codeValide("tn2026") donne false.

Exercice 2 : le quiz du club (12 pts)

Dans la page quiz.html de l'exercice 1, les bonnes réponses sont b pour q1, a pour q2 et c pour q3. Les fonctions suivantes s'ajoutent à quiz.js.

• 1) Écrire la fonction choix(nom) qui renvoie la valeur du bouton radio coché du groupe nom, ou "" si aucun n'est coché ; les boutons du groupe nom ont les id nom + "a", nom + "b" et, pour q3, nom + "c" (q1a, q1b pour q1) ; getElementById donne null pour un id qui n'existe pas (4 pts).
• 2) Écrire la fonction score() qui renvoie le nombre de bonnes réponses du quiz (4 pts).
• 3) Écrire la fonction corriger(), appelée par le bouton « Corriger » : si le code tapé dans le champ code n'est pas valide (codeValide de l'exercice 1), elle écrit « Code d'accès non valide » en rouge (red) dans le paragraphe score ; sinon elle y écrit « Score : 2/3 » (avec le score obtenu), en vert (green) si les trois réponses sont justes, en rouge (red) si le score est 0 ou 1, en orange sinon (4 pts).

Correction détaillée

Sujet original écrit pour Mission Carthage, dans le format d'un devoir pratique d'informatique (3ème Sciences de l'informatique, technologies du web). Ce n'est pas un sujet officiel.

Tout le programme : 3ème année Sciences de l'informatique · Revoir le cours · Tous les devoirs