ein Listener für tausende Elemente
Wer für jedes Listenelement einen eigenen Event-Listener registriert, baut eine Speicher- und Performance-Falle. Event Delegation nutzt Event Bubbling und ermöglicht mit einem einzigen Listener die Behandlung von Events auf beliebig vielen Elementen – auch auf solchen, die erst später dynamisch zum DOM hinzugefügt werden.
Inhaltsverzeichnis
- 1. Event Bubbling: das Grundprinzip der Event Delegation
- 2. Warum ein Listener pro Element das falsche Muster ist
- 3. Event Delegation implementieren: closest() und matches()
- 4. data-Attribute als sichere Action-Identifier
- 5. Dynamisch hinzugefügte Elemente automatisch abdecken
- 6. Event Delegation in Tabellen und komplexen Listen
- 7. Fallstricke: stopPropagation, SVG und Formular-Events
- 8. SPA-Navigation und