DOM

Updated: 06/16/2017 by Computer Hope

The Document Object Model (DOM) is an application programming interface (API) that gives programmers and developers the ability to create and modify HTML and XML documents as programming objects. The structure of the DOM for any document will resemble the actual structure of the markup of the document.

The most common programming language used in the DOM is JavaScript, which is used on most websites. Using JavaScript allows for dynamic changes to be made to the DOM, including hiding, moving, and animating certain HTML elements (such as text, tables, images, and entire divisions).

In the past, the DOM had fundamental differences between browsers, but today has become much more standardized, allowing for easier cross-browser scripting to be performed by developers.

A DOM example using HTML

Consider the following HTML document:

<html>
<head>
<title>Example</title>
</head>
<body>
<h1>Example Page</h1>
<p>This is an example page.</p>
</body>
</html>

The DOM for this document includes all of the elements and any text nodes within those elements. The code in the previous example creates an object hierarchy as shown below.

DOM example

For each element under the document root (<html>), there is an element node, and these element nodes have text nodes containing the text that is within the element. If there were an element with attributes, an attribute node would be created for that element and any text for the attribute would create a text node under that attribute node.

Internet terms, Programming terms