Attacher des gestionnaires d'événements en boucle en JavaScript
Dans la leçon précédente, nous avons appris à créer de nouveaux éléments dans une boucle. Maintenant, nous allons attacher des gestionnaires d'événements lors de la création de nouveaux éléments.
Supposons que nous ayons à nouveau ce div parent :
<div id="parent"></div>
Lançons une boucle qui ajoutera à la fin de notre
div 9 nouveaux paragraphes, en leur attachant
un gestionnaire de clic :
let parent = document.querySelector('#parent');
for (let i = 1; i <= 9; i++) {
let p = document.createElement('p');
p.textContent = '!';
// Attacher le gestionnaire de clic :
p.addEventListener('click', function() {
console.log(this.textContent);
});
parent.appendChild(p);
}
Un div est donné. Lancez une boucle qui ajoutera
dans notre div 5 inputs. Supposons qu'il y ait aussi
un paragraphe. Faites en sorte que chaque nouveau
input, lors de la perte du focus, enregistre son texte
dans le paragraphe.