Camping_RIDER: Universelle Event-Listener-Zielfunktion(en)?

Beitrag lesen

Aloha ;)

Also ich habe mir nochmal ein paar Gedanken dazu gemacht und bin zu dem vorläufigen Ergebnis gekommen, dass die 'klassische' Methode, jedem Element seinen spezifischen Event-Listener und seine spezifische Zielfunktion anzuhängen, doch in der Praxis eher in Ausnahmefällen sinnvoll ist, wohingegen Event-Delegation wohl in der Mehrheit der Fälle das Mittel der Wahl sein sollte, denn element.addEventListener("event", elementOnEvent); macht ja eigentlich nur Sinn, wenn es sich tatsächlich um ein in seinen Eigenschaften einzigartiges Element handelt, welches auch auf einzigartige Art und Weise auf ein Event reagieren soll, was in der Praxis ja eher die Ausnahme sein dürfte...

Jein. Tatsächlich ist es eine Abwägungsfrage. Ich möchte vor allem das folgende zu bedenken geben: Stell dir vor, du hast ein Container-div. Diesem hängst du ein Klickevent an. Das div-Element bekommt dynamisch Kind-Elemente dazu. Der Vorteil liegt nun auf der Hand: Du musst nicht jedem Kind-Element einzeln einen individuellen Event-Listener mitgeben. Und noch besser (falls das gewünscht ist): Sobald du ein Kindelement aus dem Container nimmst und woanders ablegst, reagiert es nicht mehr auf Klicks.

Simples Beispiel: Ein Schachbrett. Die Figuren klickbare img-Elemente innerhalb divs (die Felder) innerhalb eines großen divs (das Schachbrett). Das Schachbrett hört auf onclick. Solange die Figuren auf dem Schachbrett sind, sollen sie anklickbar sein. Sobald sie geschlagen werden, werden sie dynamisch in ein Ablagestapel-div außerhalb des Schachbrett-divs gelegt und sind damit automatisch nicht mehr anklickbar. Ein Bauer, der verwandelt wird, kann auf den Ablagestapel gelegt werden und für ihn kann eine Digur vom Ablagestapel aufs Schachfeld gestellt werden. Kein lästiges hinzufügen und entfernen von Event-Handlern.

Anderes Beispiel: je nach Container sollen die Elemente unterschiedliche klick-Aktionen ausführen, die Elemente können jederzeit in einen anderen Container hüpfen.

In anderen Anwendungen ist genau dieses Verhalten das, was man NICHT will. Wie gesagt: es ist eine auf die konkrete Anwendung bezogene Abwägung, was im konkreten Fall geschickter und eleganter ist.

Daher noch als Anmerkung zu http://wiki.selfhtml.org/wiki/JavaScript/Objekte/DOM/event/addEventListener :
Nicht, dass das alles nicht in der Doku nachzulesen wäre, aber ich fände es sinnvoll, wenn die Informationen zur Event-Delegation nicht so gut versteckt auf Seite drei eines Links zu suchen wären, sondern direkt unter dem Artikel für die 'addEventListener'-Funktion zumindest angerissen würden, eingedenk der Wichtigkeit für die praktische Arbeit damit, - oder wenn alternativ in Form eines Kurzartikels in 'JS: Anwendung und Praxis' darauf eingegangen würde.

Dann: Im wiki anmelden und dazuschreiben ;) jeder kann, darf und soll nach bestem wissen und gewissen etwas beitragen ;)

Auch von mir an dich und alle Mitleser ein "frohes Neues" ;)

Grüße,

RIDER

--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[