Event Listeners in JavaScript | JavaScript Events Tutorial
Video Statistics and Information
Channel: Dave Gray
Views: 2,483
Rating: undefined out of 5
Keywords: event listeners in javascript, javascript event listeners, listening for event in javascript, javascript event listeners tutorial, event listeners, event bubbling, event capturing, event bubbling in javascript, event capturing in javascript, addEventListener, removeEventListener, event propagation
Id: UVRDq-wnfgk
Channel Id: undefined
Length: 39min 32sec (2372 seconds)
Published: Tue Oct 20 2020
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.
Splendid work!
In this video we'll learn about Event Listeners in JavaScript with addEventListener. We'll also explore Event Bubbling, Event Capturing, Event Propagation, and Prevent Default Behaviors. We'll look at the click event, readystatechange event, mouseover & mouseout events, and the submit event while using both named and anonymous functions as event handlers. We'll also work with the add, remove, and toggle methods of a classList. Let's get started!
โ Quick Concepts outline:
JavaScript Event Listeners
(0:20) Insure the DOM is available to interact with
(1:30) How to load your script for DOM interaction
(3:30) Syntax: addEventListener(event, function, useCapture)
(4:50) Using a function name in the event listener
(5:55) Removing a function with a name: removeEventListener()
(6:50) Using an anonymous function in the event listener
(8:50) Listening for the readystatechange event
(10:30) Constructing an initApp() function
(13:30) Event Bubbling
(16:00) Event Capturing
(17:00) Event Propagation and stopPropagation()
(21:45) event.target usage
(25:05) classList, add, remove, and toggle
(34:50) Listening for a HTML Form submit event
(36:20) HTML Form default behavior
(37:00) Prevent default behavior with event.preventDefault()
If you enjoy this video, check out the ones that follow it in the playlist. Iโll continue to add more. Glad to answer your questions, too.
Event Listeners in JavaScript | JavaScript Events Tutorial: https://youtu.be/UVRDq-wnfgk