HTML and CSS Reference
In-Depth Information
EXAMPLE 15.6 ( CONTINUED )
<script type="text/javascript">
1
window.onload=function() {
2
var divObj = document.getElementById("divtest");
3
alert(divObj);
4
divObj.innerHTML="Inserting new text in the
div container.";
}
</script>
</head>
<body>
5
<div id="divtest" class="divStyle">
6
Original text in div container.
</div>
</body>
</html>
EXPLANATION
1
When the page has finished loading the statements in the anonymous function are
executed.
2
The variable, divObj , is assigned a reference to the div element identified by its id ,
divtest .
3
By adding this alert , you will be able to see what was in the original div container be-
fore it is overwritten by the new text. After the user clicks the alert's OK button, the
new text will be displayed. If the alert box is removed, the original text will be over-
written before you can see it. The only output will be what you see in Figure 15.13.
4
The innerHTML property is used to change the text within the <div></div> tags.
5
The id and class attributes are assigned to the <div> tag.
6
This is the original text that is modified by JavaScript on line 4. See Figure 15.14.
Figure 15.13 The original text before it is modified.
Search WWH ::




Custom Search