00:00 Hello there. Today you will learn what are DOM events. In order to understand the DOM events, let's first understand what are events. An event is a signal that something has occurred. For example, when you browse the YouTube page and find an interesting channel to follow, you hit the subscribe button. This is an event that tells the creator that you are interested in such content. The other example could be when you add items to the cart, in those cases the event is that items have been added to the cart and that you're ready to make a purchase online. Okay, then what are DOM events? DOM events are actions that occur as a result of a user action or as a result of a change in the DOM tree. For example, when a user clicks on a pay on the page, the click event is triggered on the button element of the DOM.

00:51 The client side scripting languages such as JavaScript can register various event listener or handlers on the elements inside the DOM tree. These event listeners can do the work behind the scene such as contacting the bank and charging money from the account based on the order value. Some of the examples of the DOM events are - uploading a file or an image on the server, updating the text field on an HTML form, clicking of a mouse or the trackpad, loading the webpage when requested, submitting a form such as login, signup or payment, pressing the keys on the keyboard when writing an email, for example. The DOM event types are categorized into seven different types including user interfaces, focus, mouse and composition events. Let's understand what kind of events each of these category contains. The user interface contains the basic event types associated with the user interfaces and document manipulation. The events included in this category are the load and unload of the page,

01:50 the error occurred on the load or when the page load is aborted and the user selection of the text on the page. The focus event contains basic event types associated with DOM events. The events included in this category are focus and focusin. These two events are similar, but they're not exactly the same. And blur and focus out. These two events are also similar, but they're not exactly the same. The mouse event contains basic event types associated with DOM events. There are many events included in this category including click and mouseover. The wheel event contains events related to rotation of a pointer device such as a trackpad or movements on the laptop. The only event it contains is called wheel. The input events are sent as notification when the DOM is updated. The event included in this category are beforeinput and input. The keyboard events are device dependent events.

02:44 That is, they rely on the capabilities of the input devices and how they are mapped in the operating systems. The events included in this category are keyup and keydown. And composition events, provide means for inputting a text in an alternate manner, to allow the of characters that might not be commonly available on the keyboard. The events that belong in this category are compositionstart, compositionupdate and compositionend. Great! So as you see, there are so many event types that as developers you can leverage in your programming. And that's it. If you work with JavaScript or any other framework such as jQuery, angular, or react, you have executed JavaScript on the browser. So the new course that we have launched is relevant for you. It's called Browser JavaScript and event loop. This course educates on how JavaScript is executed behind the scenes, and we'll cover various topics such as ExecutionContext and event loop. You will have the opportunity to visually see every step of JavaScript code execution. Check out the course link in the description below to learn more about the course and let us know if you have any questions. Keep learning and see you next time.