Introduction To DOM (Document Object Model)

Inroduction 

Basically DOM stands for Document Object Model,

  • Document Object Model is a programming interface or an API for manipulating the HTML or XML documents.
  • DOM represents the content of the HTML or XML document as a tree structure.
  • It allows us to create, change or remove the elements from that HTML or XML document.
  • It gives us capability to add events to the elements to make our page more flexible and dynamic.

XML Code

<books>
  <book>
    <author> Jay </author>
    <Title> DOM</Title>
    <PublishedDate>16-06-2022</PublishedDate>
  </book>
</books>

DOM Tree Convertion

HTML Code

<html>
  <head>
    <title>Introduction to DOM Elements</title>
  </head>
  <body>
    <h1> Jay Krishna Reddy</h1>
    <p>Here is my blog</p>
  </body>
</html>

Tree Convertion

  1. As per the above tree image, in this dom tree, the document is the root node. The root node has one child node which is the html element.
  2. The <html> element is called as the document element.
  3. Each markup can be represented by a node in that tree.

Conclusion

Thank you for reading, please let me know your questions, thoughts, or feedback in the comments section. I appreciate your feedback and encouragement.

Keep learning ...!

Next Recommended Reading Introduction To CKEditor