[COURS] JavaScript web : Écoutez des événements

Exclure des événements en JavaScript

14 octobre 2020 à 12:32:09

Bonjour,

Je suis en train de suivre le cours de JavaScript pour le web, dans le chapitre Ecoutez des événements, il y a une chose que je ne comprends pas. Il m'est demandé d'incrémenter le compteur enfant, et d'empêcher la propagation vers le haut, mais le problème est qu'il N'Y A PAS de propagation vers le haut par défaut.
J'écris mon code pour incrémenter le compteur enfant, et seul ce compteur s'incrémente, sans incrémenter le compteur parent.

Une explication ?

Voici le code HTML :

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="base.css">
  </head>
  <body>  
    <article id="parent">
      <a class="link" id="child" href="#">Cliquez ici</a>
      <p>Battle d'événement !</p>
      Parent : <span id="parent-count">0</span>
      Enfant : <span id="child-count">0</span>
    </article>
    
    <script type="text/javascript" src="index.js"></script>
  </body>
</html>

Et mon code JS :

const parent = document.getElementById("parent");
const parentCounteur = document.getElementById("parent-count");
//let np = 0;
//////////////////////////////////////////////////////////
const child = document.getElementById("child");
const childCounter = document.getElementById("child-count");
let clickNumber = 0;

child.addEventListener('click', function(event) {
    clickNumber++;
  childCounter.innerHTML=clickNumber;
});

Merci de m'aider, parce que du coup je résous l'exercice sans rien faire.

Lien vers l'exercice

-
Edité par inoual 14 octobre 2020 à 12:35:37

Anonyme

14 octobre 2020 à 12:41:17

Le compteur « parent » n’est pas le parent du compteur « enfant ».

inoual

14 octobre 2020 à 12:43:12

Bon, j'ai trouvé la solution : c'est juste que pour voir si le compteur du parent s'incrémente, il faut aussi écouter le parent. Et ce n'est dit nulle part.

Ca aurait été très judicieux d'écrire "attention : pensez à bien écouter les clics au niveau parent, pour vois s'il est affecté", ou un truc du genre.

Je trouve que ce cours sur le JavaScript est infiniment moins pédagogique que celui de Will Alexander, qui est très clair du début à la fin. Chaque page a au moins un point incompréhensible sans se triturer le cerveau.

-
Edité par inoual 14 octobre 2020 à 12:44:27

Anonyme

14 octobre 2020 à 12:52:19

A priori tu n’as pas compris le concept de propagation des événements ; tu devrais revoir le cours.

inoual

14 octobre 2020 à 13:25:17

MatTheCat a écrit:

A priori tu n’as pas compris le concept de propagation des événements ; tu devrais revoir le cours.

J'ai très bien compris ce qu'était la propagation d'un événement et c'est justement pour ça que je me pose la question de la pédagogie de cet exercice (qui est perceptible sur chaque chapitre).

Quelqu'un qui n'y connaît rien serait probablement passé au chapitre suivant en considérant que tout fonctionne sans se poser de question.

Je trouve qu'il aurait été judicieux de signaler à l'élève débutant qu'il faut qu'il pense à écouter l'événement chez le parent pour vérifier que son compteur parent est affecté par l'enfant.