DEV Community

Raji Sarafadeen Sanjo
Raji Sarafadeen Sanjo

Posted on

JAVASCRIPT EVENT AND THE MAGIC OF IT IN THE WEB BROWSER

This article is primarily written with the beginners in javascript in mind.
As a beginner, we often wondered and are curious as to how a button or text will be clicked and something will change in the UI(user interface). It usually confusing at the beginning of our journey and not so simple to grasp the concept of how every event is been linked together to affect the browser UI and the DOM (Document Object Model).
Let's get started with what event is in javascript.

Client-side JavaScript programs are almost universally event-driven: rather than running some kind of predetermined computation, they typically wait for the user to do something and then respond to the user’s actions. The web browser generates an event when the user presses a key on the keyboard, moves the mouse, clicks a mouse button, or touches a touchscreen device. Event-driven JavaScript programs register callback functions for specified types of events in specified contexts, and the web browser invokes those functions whenever the specified events occur. These callback functions are called event handlers or event listeners, and they are registered with addEventListener():

we will be demonstrating two of the above-mentioned event, namely, click and keyup.

HTML
Image description

CLICK EVENT

Image description

KEYUP

Image description

RESULT

Image description

Thank you for reading!

Top comments (0)