What is the Root Element of the HTML DOM?

Last Updated : 20 Feb, 2024

The root element of the Document Object Model (DOM) is the <html> element. It represents the root of the HTML document tree and encapsulates all other elements within the document. The DOM tree is a hierarchical representation of the structure of an HTML document, with the <html> element serving as the highest level or starting point.

Key Points:

Root Element: The <html> element is the top-level element in the DOM hierarchy, representing the entire HTML document.
Encapsulation: All other elements within the HTML document are descendants of the <html> element and are encapsulated within it.
Parent Element: While the <html> element is the root of the DOM tree, it serves as the parent element for the <head> and <body> elements, which encapsulate metadata and document content, respectively.
DOM Manipulation: Developers can manipulate the DOM tree programmatically using JavaScript to access, modify, or add elements dynamically.

Features:

Basic Structure: The HTML document begins with the <html> element, followed by the <head> and <body> elements, which contain metadata and document content, respectively.
Hierarchical Representation: The DOM tree represents the hierarchical structure of the HTML document, with the <html> element at the root and child elements nested within it.
Accessing the Root Element: Developers can access the root element of the DOM using JavaScript methods such as document.documentElement or by querying for the <html> element directly.
DOM Manipulation: The root element and its descendants can be manipulated using JavaScript to dynamically update the content, structure, or styling of the HTML document.