From http://www.w3schools.com (Copyright Refsnes Data)

DHTML - HTML DOM

What is the HTML DOM?

The HTML DOM is:

A Document Object Model for HTML
A standard programming interface for HTML
Platform- and language-independent
A W3C standard

The HTML DOM defines the objects and properties of all HTML elements, and the methods (interface) to access them.

In other words: The HTML DOM is a standard for how to get, change, add, or delete HTML elements.

Change an HTML Element

The following example changes the content of an h1 element:

Example

<html>
<body>

<h1 id="header">Old Header</h1>

<script type="text/javascript">
document.getElementById("header").innerHTML="New Header";
</script>

</body>
</html>

Try it yourself »

Example explained:

The HTML document above contains an h1 element with id="header"
We use the HTML DOM to get the element with id="header"
A JavaScript changes the content (innerHTML) of that element

Change an HTML Attribute

The following example changes the src attibute of an img element:

Example

<html>
<body>

<img id="image" src="smiley.gif">

<script type="text/javascript">
document.getElementById("image").src="landscape.jpg";
</script>

</body>
</html>

Try it yourself »

Example explained:

The HTML document above contains an img element with id="image"
We use the HTML DOM to get the element with id="image"
A JavaScript changes the src attribute of that element from "smiley.gif" to "landscape.jpg"

HTML DOM Tutorial

To learn more about the HTML DOM, please read our complete HTML DOM tutorial.

« Previous

Next Chapter »