Flere håndterere på et element i JavaScript

Hvis et element har flere håndterere på den samme hændelse, så vil alle blive eksekveret, selvom bubbling stoppes. Det vil sige, stopPropagation forhindrer hændelsen i at bevæge sig videre, men alle håndterere på det aktuelle element vil blive udført. Se eksemplet:

javascriptelem1.addEventListener('click', function() {
  console.log('grøn');
});
elem2.addEventListener('click', function(event) {
  console.log('lyseblå - første håndterer');
  event.stopPropagation(); // stop bubbling
});
elem2.addEventListener('click', function() {
  console.log('lyseblå - anden håndterer'); // vil køre alligevel
});
elem3.addEventListener('click', function() {
  console.log('rød');
});

Du kan teste det: