Syntax - Tasty Web Development Treats Hasty Treat - Things You Should Know About Javascript Events
May 4, 2020
Dive into the fascinating world of JavaScript events, starting with event bubbling and capturing. Discover how these concepts influence event listener behavior in the DOM. Learn about the crucial 'prevent default' function and the differences between 'target' and 'currentTarget.' The session also covers the importance of the isTrusted property and the utility of the addEventListener method's 'once' option. It's a treasure trove of insights for leveling up your web development skills!
AI Snips
Chapters
Transcript
Episode notes
Event Bubbling
- Event bubbling describes how events trigger on parent elements.
- Clicks on a child element also trigger events on containing elements up to the root.
Event Capturing
- Event capturing happens before bubbling, going top-down.
- The browser checks for click events from the window down to the clicked element.
Prevent Accidental Clicks
- Use capture phase to prevent lower elements from triggering events.
- This is useful when accidental clicks on elements within draggable components need to be stopped.