JavaScript - Problem mit addEventListener

[Auge]

Hallo

Was ist mit

Registriere das Event an einem Elternelement aller Buttons. gemeint?

Damit kann ich nichts anfangen. Es soll doch nur dann etwas passieren, wenn einer der Buttons angeklickt wird, nicht wenn sonst irgendwo geklickt wird.

Wie der bei Christian verlinkte Artikel von Molily erklärt, gibt es die Event Delegation. Ein Klick auf einen Button wird nicht nur bei dem Button selbst registriert (im Sinne von „bemerkt“), sondern durch das „Event Bubbling“ auch von dessen Elternelementen.

Im Falle von vielen gleichartigen Events, wie er auch auf deine Buttonsammlung zutrifft, muss so nur ein Event registriert werden statt der N Events für jeden Button. Das verbraucht weniger Ressourcen, da erst einmal nur ein (Eltern)-Element statt der vielen Kindelemente, an denen der Event ausgelöst wird, überwacht werden muss.

Die Buttons haben zwar alle einen gemeinsamen Vorfahren, aber kein direktes Elternelement gemeinsam. Und dieser gemeinsame Vorfahr enthält natürlich sehr viel anderes, als nur die Buttons.

Du kannst einerseits den Buttons in ein gruppierendes Element einschließen und das Event für dieses gruppierende Element registrieren. Du kannst das Event aber auch beim gemeinsamen Vorfahr registrieren und über den mit event.target ermittelten Wert prüfen, ob überhaupt ein Button betätigt wurde und nur dann den Code ausführen. Was sinnvoller ist, kommt auf eventuell vorhandene weitere Funktionen und die tatsächliche HTML-Struktur an.

Tschö, Auge