The Document Object Approach (DOM) is a platforms & language independent model of representing HTML or XML content. It specifies the logical structure of the documents as well as how an application software may access and alter them.
All document components, attributes, text, and so on are organized in a hierarchical tree-like structure in the DOM, akin to a family tree in real life, which consists of parents and offspring. These distinct portions of the text are referred to as nodes in DOM language.
The Document Object Model that represents HTML document is referred to as HTML DOM. Similarly, XML DOM refers to the DOM that represents the XML document.
Consider the following basic HTML page to better grasp this:
< !DOCTYPE html> < html> < head> < title>DOM Example< /title> < /head> < body> < h1>Ducat India< /h1> < ul> < li>Training < /li> < li>Development< /li> < /ul> < /body> < /html>
The diagram above depicts the parent/child connections between the nodes. The root node of the DOM tree is the topmost node, the Document node, which seems to have one child, the < html> element. The < head> and < body> elements, on the other hand, are child nodes of the < html> parent node.
Because they are on the similar level, the components < head> and < body> are also siblings. In addition, the text contained within an element is a child node of the parent element. Thus, “Mobile OS” is regarded as a child node of the < h1> that includes it, and so on.
Even though they have no effect on the graphic representation of the content, comments within an HTML document are nodes in the DOM tree. Although comments are important for describing code, you will seldom need to extract and edit them.
HTML properties such as id, class, title, style, and so on are also regarded nodes in the DOM hierarchy, but they do not participate in parent/child interactions in the same way that other nodes do. They are accessible through the element node that includes them.
The Document Object Model (DOM) is a web information application software. It depicts the page so that programs may modify the layout, appearance, and contents of the document. The document is represented by the DOM as nodes and entities, allowing computer languages to interact with the webpage.
Q2. Why do we use DOM?
Q3. How DOM is created?
A DOM tree begins with the uppermost element, which is an HTML element, and spreads out according to the presence and hierarchy of HTML elements in the document.When an HTML element is identified, it generates a DOM node (Node) object from its class (constructor function).
Q4. What are DOM elements?
DOM is an abbreviation for Document Object Model. It’s a programming interface that lets us add, alter, or delete components from the page. To make our page more dynamic, we can also add events to these elements. The DOM sees an HTML document as a node tree. An HTML element is represented by a node.
Q5. What is DOM a tree?
The DOM, also known as the DOM tree, is made up of a tree of objects known as nodes. We discussed whatever the Document Object Model (DOM) is, how to obtain the document object and edit its attributes using the console, and the distinction between HTML source code as well as the DOM in the Introduction towards the DOM.