JavaScript Events Simply Explained With Real Code Examples

I remember when I started JavaScript, events confused me a lot. Not because they are hard. Just because nobody explained it simply. So let me try. Okay so what is an event An event is just something the user does on your page. Clicked a button. Typed in a box. Pressed a key. Submitted a form. Scrolled down. All of these are events. JavaScript lets you watch for these things and do something when they happen. That is the whole idea. The basic way to listen const btn = document . getElementById ( " myBtn " ); btn . addEventListener ( " click " , function () { console . log ( " someone clicked the button " ); }); Three things here. The element. The event name. The function to run. That is the pattern you will use everywhere. There is also an event object When something happens the browser gives you an object with all the details about it. Most people call it e or event . btn . addEventListener ( " click " , function ( e ) { console . log ( e . target ); // what got clicked console . log (