What is the DOM?
The Document Object Model (DOM) is a programming interface for HTML documents. It represents the page as a tree of nodes that JavaScript can manipulate.
console.log(document.title);
console.log(document.URL);
console.log(document.body);The document Object
document is the entry point to the DOM. It provides methods for selecting, creating, and modifying elements.
document.title = "New Page Title";
console.log(document.title);
const divs = document.getElementsByTagName("div");
console.log("Number of divs:", divs.length);
document.body.style.backgroundColor = "lightblue";DOM Tree Structure
Every HTML element, attribute, and text is a node in the DOM tree. You can navigate using properties like parentNode, childNodes, and children.
const body = document.body;
console.log("Parent of body:", body.parentNode);
console.log("Children of body:", body.children.length);
for (let child of body.children) {
console.log(child.tagName);
}