Event Listeners in JavaScript - JavaScript Events Tutorial

Learn about JavaScript event listeners in this comprehensive tutorial. Explore event bubbling, capturing, propagation, and default behavior prevention. Discover how to use addEventListener with named and anonymous functions, handle various events like click, readystatechange, mouseover, and submit, and work with classList methods. Gain practical knowledge on DOM interaction, script loading techniques, and constructing an initApp function for efficient event handling in web development.

Syllabus

Insure the DOM is available to interact with
How to load your script for DOM interaction
3:30 Syntax: addEventListenerevent, function, useCapture
Using a function name in the event listener
5:55 Removing a function with a name: removeEventListener
Using an anonymous function in the event listener
Listening for the readystatechange event
Constructing an initApp function
Event Bubbling
Event Capturing
Event Propagation and stopPropagation
event.target usage
classList, add, remove, and toggle
Listening for a HTML Form submit event
HTML Form default behavior
Prevent default behavior with event.preventDefault