 Dear students, we have seen in earlier modules that what is document object model. Let's have a look at it again. And then we will see how to access the document object model through JavaScript. We discussed that we can represent any HTML document in the form of a document object model. In fact, if we have any XML document, we can represent it in the form of a tree. And we can even access it through JavaScript through DOM. When we represent HTML document as a DOM tree, we have a data structure. And that data structure becomes accessible in JavaScript. And when we become accessible in JavaScript, then we can do manipulations in this tree. We can access it, modify it, add new elements in it, remove existing elements. And when we manipulate elements from the DOM tree, then its impact will be on the HTML document. The changes we will do through JavaScript in the DOM tree will be reflected in that page. Here is an example of a DOM tree. This is a HTML document. When we are accessing DOM tree through JavaScript, then we will have the main variable through which we will access the document. The document represents the document object model DOM object for the HTML page on which we are working. So, this is the document we have. After that, every element will become a node. HTML is a node, headache node, meta, titles. These are all nodes. The nodes that we will have on a level in the tree, we will call them sibling nodes. The nodes that we will have on a level in the tree, we will call them children nodes, like the children of the body we have, H1, P, image, H2, these are the children nodes. And then we have a parent node of a node. We will call it a parent node. So, this is the DOM tree reflection we have of this HTML code. We can access this tree through JavaScript using the document object. When we have a DOM tree created by nodes, when we are actually creating in pre-memory, then we have every single node. Whether it is an element or a text, whether it is spaces or new line characters, everything becomes a node. Like here, if we have an example of a paragraph tag, we have an anchor tag in it. This is just because of the text document. Otherwise, this anchor tag should appear in the code. Let's say it appears after in, right? This is how it appears. Then we have a central part text, some anchor tag is being closed. Then we have a new line and then paragraph tag is being closed. How will we have a DOM tree for this? By the way, when we say it will be a DOM tree, automatically we have a browser to handle and create it. So, we have this P, this would be an element node because it represents an HTML element. Now, we have text in it. This text will be our own node. We will call it text node. So, we have this text node. After this, we have an anchor tag. Then we have a second child of this P, which would be an anchor tag. Then we would have an anchor tag. An anchor tag would have some children. Its attribute would also be a children. We will call it attribute node. The text used in the anchor tag will also be a child for us. This is the central part. So, it will be a text node for us. Then we have an enter, some spaces and new line. Now, these new lines and spaces are also our text node. So, it will come into the text node and if we have given these spaces, they will come into it. So, this is an exact demonstration of how we will create a tree in our memory. We will have some element nodes, some text nodes, some attribute nodes. We will create a tree with different types of nodes. So, we have data types related to the form. Document would be used to represent the whole document. In that, we have an element node as well as some text node. So, we will access all the nodes of the tree using the node object. For that, we will have nodes. If we have multiple nodes, for example, if we get all the children of an element of a node, then it will be a collection of nodes. So, it will be available in the node list form. So, this is an array of nodes. Then, we will have an element specifically to represent any element of HTML. Like in the last example, P was an element, A was an element. And then, we will have some attribute nodes in which we will have some attributes of an element. So, we will have those as nodes. So, for all these objects, we have defined data types. Through these, we will access the DOM and manipulate it.