Afficher un nom différent à chaque clic

Bonjour, je suis débutante en javaScript et j'aimerai faire ensorte que à chaque fois que je clic sur un bouton un nom s'affiche et si j'ai par exemple 3 nom dans mes données lorsque j'appui sur le bouton, on mets le nombre de nom qui reste.

Bonjour
Pouvez-vous ré-expliquer en français?

:salut:

Code:

<output id="outMot"></output> <button type="button" id="btnSuivant">Mot suivant</button>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
window.addEventListener('load', ev => {
    // le DOM est construit et la page web est visible
 
    // début code du test
 
    const
        arNoms = [
            'Avocat',
            'Abricots',
            'Airelles',
            'Ananas',
            'Artichaud',
        ],
        arNomsLength = arNoms.length,
        elemBtnSuivant = document.querySelector('#btnSuivant'),
        elemOutMot = document.querySelector('#outMot');
 
    let
        n = 2; // 2 === 'Airelles'
 
    elemOutMot.value = arNoms[n-1]; // initialisation sur 'Abricots"
 
    // gestionnaire d'événement
    elemBtnSuivant.addEventListener('click', ev => {
        if (n >= arNomsLength) {
            n = 0; // 0 === 'Avocat'
        }
 
        elemOutMot.value = arNoms[n++]; // n++ signifie exécute arNoms[n] puis ajoute 1 à n
    }, {
        capture: false,
        passive: true,
        once: false
    });
 
    // fin code du test
 
}, {
    capture: false,
    passive: true,
    once: false
});

Je vous conseille d'utiliser mdn (la version anglaise est devenue de facto la base de connaissance officielle avec le soutien de Microsoft et de Google).

La version française est ici : https://developer.mozilla.org/fr/docs/Web/JavaScript

Pour chercher un mot JS il suffit de taper : mdn js motChercher.
Pour un mot HTML : mdn html motChercher.
Pour un mot CSS : mdn css motChercher.