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> |
View it » |
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> |
View it » |
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.
|