Document Object Model


Document object represents the whole HTML document that is displayed in that window.

Document Object Model (DOM) is the way in which a document’s content is accessed and modified.

When a web page is loaded, the browser creates the Document Object Model of the page. This is the root element that represents the html document. The HTML DOM model is constructed as a tree of Objects.

With the help of a document object, we can add dynamic content to our web page.

According to W3C: "The W3C Document Object Model (DOM) is a platform and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document."


DOM Programming Interface

The programming interface is the properties and methods of each object.

DOM methods are actions we can perform on the HTML Elements.

DOM properties are values of the HTML Elements that we can set or change.



Some Methods of document model

Method Description
write(“string”) Writes/prints the given string on the document.
getElementById() Returns the element having the specified id value.
getElementsByClass() Returns all the elements having the specified class name.
getElementsByName() Returns all the elements having the specified name value.
getElementsByTagName() Returns all the elements having the specified tag name.

Some properties of document model


Properties Description
innerHTML Writes the dynamic html on the html document.
innerText Writes the dynamic text on the html document.