Anexando manipuladores em loop em JavaScript
Na lição anterior, aprendemos a criar novos elementos em um loop. Agora vamos anexar manipuladores de eventos ao criar novos elementos.
Suponha que temos novamente esta div pai:
<div id="parent"></div>
Vamos executar um loop que adicionará ao final da nossa
div 9 novos parágrafos, anexando a eles
um manipulador de clique:
let parent = document.querySelector('#parent');
for (let i = 1; i <= 9; i++) {
let p = document.createElement('p');
p.textContent = '!';
// Anexando o manipulador de clique:
p.addEventListener('click', function() {
console.log(this.textContent);
});
parent.appendChild(p);
}
Dada uma div. Execute um loop que adicionará
à nossa div 5 inputs. Suponha que também há um
parágrafo. Faça com que cada novo
input, ao perder o foco, grave seu texto
no parágrafo.
