Įvykių delegavimas JavaScript

Ankstesnėje pamokoje buvo aprašyta problema, kylanči pridedant naujus elementus, ir pateiktas jos sprendimas. Šioje pamokoje mes nagrinėsime tinkamesnį problemos sprendimo būdą - įvykių delegavimą. Pažvelkime į jį.

Kaip jau žinote, spustelėdami li, mes kartu spustelime ir ul. Tai įmanoma dėka įvykių plitimo. Mes galime panaudoti tai savo uždaviniui išspręsti: priskirsime įvykį ne kiekvienai li, o jų tėviniam elementui ul:

javascriptlist.addEventListener('click', function() {
  
});

Dabar įvykio apdoroklyje this rodys į elementą, prie kurio pririštas apdoroklis, o event.target - į elementą, kuriame įvyko įvykis:

javascriptlist.addEventListener('click', function(event) {
  console.log(this);         // mūsų sąrašas
  console.log(event.target); // sąrašo punktas
});

Padarykime taip, kad li, ant kurios buvome paspaudę, į pabaigą būtų pridėtas šauktukas:

javascriptlist.addEventListener('click', function(event) {
  event.target.textContent = event.target.textContent + '!';
});