DOM Vs. Shadow DOM Vs. Virtual DOM
In this article, we will discuss DOM, Shadow DOM, and Virtual DOM. First, DOM (Document Object Model) is the standard that helps the browser understand and render the HTML code we write. This standard, as well as Shadow DOM, is determined by the W3C (World Wide Web Consortium).
DOM is the tree-like structure in which the elements that make up the HTML structure are held on the browser side. The DOM API consists of functions and properties that allow us to manipulate this structure. For example, let's say we have a simple HTML page with an h1 tag that says "Hello world". We can manipulate this tag or other tags placed in the DOM using the DOM API.
document.querySelector("h1").innerText = "Bye bye world"