Devoir de contrôle n°1 STI : HTML, CSS et JavaScript

Exercice 1 : fonctions JavaScript (6 pts)

Écrire en JavaScript les trois fonctions suivantes, sans utiliser Math.max ni les méthodes de tableau comme reduce :

• estBissextile(an) renvoie true si l'année an est bissextile (divisible par 4, sauf les années divisibles par 100 qui ne sont pas divisibles par 400), sinon false (2 pts).
• moyenne(tab) renvoie la moyenne des nombres du tableau tab, arrondie à deux décimales (2 pts).
• plusGrand(tab) renvoie le plus grand élément du tableau tab, qui n'est pas vide (2 pts).

Exemples : estBissextile(2024) donne true, estBissextile(1900) donne false, moyenne([12, 15.5, 9]) donne 12.17 et plusGrand([3, 9, 2]) donne 9.

Exercice 2 : formulaire d'inscription (8 pts)

Un lycée propose une inscription en ligne à un bac blanc. La page contient un formulaire avec : le nom (champ texte), l'adresse e-mail (champ texte), le niveau (liste déroulante : Maths, Sciences, Informatique) et une case « J'accepte le règlement ».

• 1) Écrire le code HTML du formulaire. Le formulaire s'appelle f et doit appeler la fonction envoyer() quand on le valide (2 pts).
• 2) Écrire la fonction nomValide(nom) : le nom, une fois les espaces des extrémités supprimés, doit avoir au moins 3 caractères, et ne contenir que des lettres (accentuées ou non), des espaces ou des tirets (2 pts).
• 3) Écrire la fonction emailValide(email) : pas d'espace, un seul @ qui n'est pas au début, et un point après le @ qui n'est ni juste après le @, ni à la fin (2 pts).
• 4) Écrire la fonction erreurs(nom, email, regle) qui renvoie un tableau de messages : « Nom invalide », « Email invalide » et « Il faut accepter le règlement » (dans cet ordre) pour chaque problème (2 pts).

Exercice 3 : mise en page en CSS et table de multiplication (6 pts)

Voici le code HTML d'une page.

<body>
  <h1>Bac blanc</h1>
  <ul id="menu">
    <li><a href="index.html">Accueil</a></li>
    <li><a href="inscription.html">Inscription</a></li>
    <li><a href="resultats.html">Résultats</a></li>
  </ul>
  <table id="notes">
    <tr><th>Matière</th><th>Note</th></tr>
    <tr><td>Maths</td><td>14</td></tr>
    <tr><td>Informatique</td><td>17</td></tr>
    <tr><td>Physique</td><td>12</td></tr>
  </table>
</body>

• 1) Écrire la feuille de style CSS qui : centre le titre h1 et le met en bleu (#1d5ba6) ; transforme la liste du menu en barre horizontale sans puces, avec des liens qui deviennent rouges au survol de la souris ; donne au tableau des bordures fines, et un fond gris clair (#eeeeee) aux lignes de classe pair (4 pts).
• 2) Écrire la fonction tableMultiplication(n) qui renvoie un tableau de 10 textes de la forme « 3 x 1 = 3 » (2 pts).