Java Script Events

Table of contents
What is Event
Can I know how you find and came to this blog. You might have gone to the browser and searched for hash node and then you searched for this topic and you found this blog and finally clicked on it.
But have you ever thought that how browser knew that you clicked on this blog not anywhere else. All of these Events like clicks or hover are listened or sensed by Event Listeners.
Event Listener in Java Script
And in Java Script, we have a function called “addEventListener”, which helps us to add Events. And it’s basic syntax looks like this:
let button = document.getElementById('button')
button.addEventListener('click',function(){
console.log("Button is clicked")
})
In this event listener function, the first argument is the type of event we wanna to listen, like: click, hover, select etc. and then we write an function which will be executed when that event happens.
Event types
So let’s Understand types of Events we have in Java Script:
Event Type | Will work when |
click | user clicks on any element |
dblclick | user double-clicks on any element |
mousedown | mouse button is pressed down on an element |
mouseup | mouse button is pressed up on an element |
submit | the form is submitted |
change | value of any Input, select or text area element changes |
focus | the input box gets focus or you clicked over them |
blur | the input box loses focus |
load | entire page has just finished loading and all resources loaded successfully. |
unload | user navigates away from that page. |
drag | any element is been dragged from its position |
drop | that dragged element is dopped in any drop zone |
play | the Media starts playing |
Hope you learned Something and Found reading this blog Helpful. Make sure to hit on the like icon only if you found reading this blog helpful.
Subscribe to my newsletter
Read articles from Manish Saw directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by
