DOM Custom Events
DOM Custom Events are essentially functions that run when certian DOM elements are interacted with. DOM Custom Events result in some of the most famous webpage prompts such as the submit button, checking the checkbox before proceeding, and the password strength checker.
How to Create DOM Custom Events
Creating a custom DOM event is easy. First, find the element you want to change or add when a certain condition is met. A good example would be making sure a checkbox is checked before a submit button is clicked. In this scenario, we create an event listener based on the anchor element we are interested in monitoring. In this case that is the checkbox. We tell the event listener to listen for when the submit button is pressed and when that happens run a function to check the status of that checkbox.
Why we Use DOM Custom Events
DOM custom events are insanely useful in allowing the programmer to effectivly make a webpage interactive. Interactivity is important especially when you work on something that is user facing. Imagine being a user that is trying to login to a website, when you try to login and mispell your password the site reloads but does not let you know that your password was incorrect. The frustration that would ensue could have been easily avoided had that login page had some custom DOM events to let the user know that the password was incorrect.