Tableaux

Création et Utilisation des tableaux indexés et associatifs.

Exemple

Dans le dossier 1-Bases :

  • Ajoutez le fichier 3-tableaux.html

1
<!DOCTYPE html>
2
<html lang="fr">
3
  <head>
4
    <title>JS Tableaux</title>
5
    <meta charset="utf-8" />
6
    <meta name="viewport" content="width=device-width, initial-scale=1" />
7
    <link
8
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css"
9
      rel="stylesheet"
10
      integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx"
11
      crossorigin="anonymous"
12
    />
13
  </head>
14
  <body>
15
    <header class="p-2 bg-secondary text-light bg-gradient">
16
      <section>
17
        <h2>JS - Tableaux</h2>
18
      </section>
19
    </header>
20
21
    <main class="p-4">
22
      <h1>Exercice</h1>
23
      <h2>Ajouter dans le fichier 3-tableaux.js :</h2>
24
      <ul>
25
        <li>
26
          Déclaration des variables : <b>tabIndex</b> : dupont, jean, 30,
27
          <b>tabAssociatif</b> : nom:dupont, prenom:jean, age:30
28
        </li>
29
        <li>
30
          Afficher dans la console :
31
          <b>Je m'appelle dupont jean et j'ai 30 ans</b>
32
          <ul>
33
            <li>avec tabIndex et "</li>
34
            <li>avec tabIndex et `</li>
35
            <li>avec tabAssociatif et "</li>
36
            <li>avec tabAssociatif et `</li>
37
          </ul>
38
        </li>
39
      </ul>
40
    </main>
41
42
    <footer>
43
      <nav class="navbar navbar-expand-lg navbar-light bg-secondary bg-gradient">
44
        <ul class="navbar-nav mr-auto mb-2 mb-lg-0">
45
          <li class="nav-item">
46
            <a class="nav-link" href="https://www.univ-littoral.fr/">ULCO</a>
47
          </li>
48
          <li class="nav-item">
49
            <a class="nav-link" href="https://fcu.univ-littoral.fr/">FCU</a>
50
          </li>
51
          <li class="nav-item">
52
            <a class="nav-link" href="https://deust-bcmm.univ-littoral.fr/">W2D</a>
53
          </li>
54
        </ul>
55
      </nav>
56
    </footer>
57
58
    <script src="js/3-tableaux.js"></script>
59
  </body>
60
</html>
61
  • Dans le dossier js ajoutez le fichier 3-tableaux.js
Exercice :
  • Ajouter dans le fichier 3-tableaux.js :
    • Déclaration des variables : tabIndex : dupont, jean, 30, tabAssociatif : nom:dupont, prenom:jean, age:30
    • Afficher dans la console : Je m'appelle dupont jean et j'ai 30 ans
      • avec tabIndex et "
      • avec tabIndex et `
      • avec tabAssociatif et "
      • avec tabAssociatif et `
  • Ouvrez dans votre navigateur le fichier 3-tableaux.html
  • Ouvrez la console