<html>
<body>
<script type="text/javascript">
document.write("Hello World!")
</script>
</body>
</html>
Document Object: Write text with
Formatting to the output
<html>
<body>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
</body>
</html>
Document Object: Use getElementById()
<html>
<head>
<script type="text/javascript">
function getElement() {
var x=document.getElementById("myHeader")
alert("I am a " + x.tagName + " element")
}
</script>
</head>
<body>
<h1 id="myHeader" onclick="getElement()">Click to see what element I am!</h1>
</body>
</html>
DocumentObject:UsegetElementsByName()
<html>
<head>
<script type="text/javascript"> function getElements() {
var x=document.getElementsByName("myInput")
alert(x.length + " elements!")
}
</script>
</head>
<body>
<input name="myInput" type="text" size="20"><br />
<input name="myInput" type="text" size="20"><br />
<input name="myInput" type="text" size="20"><br />
<br />
<input type="button" onclick="getElements()" value="How many elements named
'myInput'?">
</body>
</html> 59
Document Object: Return the innerHTML
of the first anchor in a document
<html>
<body>
<a name="first">First anchor</a><br />
<a name="second">Second anchor</a><br />
<a name="third">Third anchor</a><br />
<br />
InnerHTML of the first anchor in this document:
<script type="text/javascript">
document.write(document.anchors[0].innerHTML)
</script>
</body>
</html>
Document Object: Access an item in a collection
<html>
<body>
<form id="Form1" name="Form1"> Your name: <input type="text">
</form>
<form id="Form2" name="Form2"> Your car: <input type="text">
</form>
<p>
To access an item in a collection you can either use the number or the name of the item:
</p>
<script type="text/javascript">
document.write("<p>The first form's name is: " + document.forms[0].name + "</p>")
document.write("<p>The first form's name is: " + document.getElementById("Form1").name
+ "</p>")
</script>
</html>
SEE VIDEO
SEE VIDEO
0 Responses So Far: