JavaScript Events Handlers— onreadystatechange and onselectionchange

Photo by Mikkel Jönck Schmidt on Unsplash

In JavaScript, events are actions that happen in an app. They’re triggered by various things like inputs being entered, forms being submitted, and changes in an element like resizing, or errors that happen when an app is running, etc. We can assign an event handler to handle these events.

Events that happen to DOM elements can be handled by assigning an event handler to properties of the DOM object for the corresponding events.

In this article, we will look at the onreadystatechange and the onselectionchange event handlers.

window.document.onreadystatechange

The onreadystatechange lets us attach an event handler to handle the readystatechange event. The readyState is changed as our page loads.

The event will be trigger when the document.readyState changes values, which can be one of 3 values, which is loading , which means that the document is loading, interactive , which means that the document has finished loading and the document has been parsed but sub-resources like images, stylesheets and frames are still loading, or complete , which means that the document and sub-resources have loaded.

For example, we can write the code to get the readyState of document as the page is…