HTML and CSS Reference
In-Depth Information
need to be changed. Writing
document[“form3”][“button2”]
in place of
docu-
ment.forms[2].elements[1]
would make the change easier.
If the first form on the page is named “myForm”, there are several ways to reference it:
document.forms[0]
document.forms.myForm
document.forms["myForm"]
And to name a form's input element:
document.forms[0].elements[0]
document.myform.button1
document["myForm"]["button1"]
EXAMPLE
11.7
</html>
<head><title>Naming Buttons</title></head>
<body bgcolor="cyan"><font face="arial">
<strong>Naming Forms and Buttons<br />
<big>
1
<
form name="myform"
>
2
<
input type="button" name="button1"
id="button1"
value="red"
/>
3
<input type="button" name="button2"
id="button2"
value="blue"
/>
4
</form>
<script type="text/javascript">
document.write("<b><br />Form name is: </b><em>" +
5
document.myform.name
+ "</em>");
document.write("<b><br />Form name is: </b><em>" +
6
document["myform"].name
+"</em>");
document.write("<b><br />Name of first button is:</b><em> " +
7
document["myform"]["button1"].name
+ "</em>and its type is<em>"
+
document.myform.button1.type
);
document.write("</em><b><br />Value of button1 field:</b><em> " +
8
document["myform"]["button1"].value
);
document.write("</em><b><br />Name of second button is:</b><em> "
+
document.myform.button2.name
);
document.write("</em><b><br />Value of button2 field:</b><em> "
+
document.myform.button2.value
);
</script>
</big>
</strong>
</body>
</html>