<html>
<body id="myBody" class="myBody">
<form id="myForm">
Firstname: <input id="fname" type="text" value="Mickey" />
Lastname: <input id="lname" type="text" value="Mouse" />
<input id="sub" type="button" value="Submit" />
</form>
<p>Get the value of all the elements in the form:<br />
<form id="myForm1" action="index.php" method="post" name="myForm1">
name: <input id="fname" type="text" value="Mickey" />
<input id="sub" type="button" value="Submit" onclick="changeAction()"/>
</form>
<form id="myForm2" action="index.php" method="post" name="myForm2">
name: <input id="fname" type="text" value="Mickey" />
<input id="sub" type="button" value="Submit" onclick="Submit1()"/>
<input id="res" type="button" value="reset" onclick="reset1()"/>
</form>
</body>
<script>
//Form 对象的集合
//elements 集合可返回包含表单中所有元素的数组。
/*var x = document.getElementById('myForm');
for(var i=0;i<x.length;i++){
document.write(x.elements[i].value);
document.write("<br />");
document.write(x.elements[i].type);
document.write("<br />");
}
//Form 对象的属性
//action 属性可设置或返回表单的 action 属性。
//action 属性定义了当表单被提交时数据被送往何处。
function changeAction(){
var x = document.getElementById("myForm1");
alert(x.action); //http://localhost/js/dom/index.php
x.action = "index1.php";
alert(x.action); //http://localhost/js/dom/index1.php
}
//id 属性可设置或返回表单的 id
var x = document.getElementsByTagName("form")[0];
alert(x.id); //myForm
//length 属性可返回表单中元素的数目
var x = document.getElementById('myForm1');
alert(x.length); //2
//method 属性可设置或返回用于表单提交的 HTTP 方法
var x = document.getElementById('myForm1');
alert(x.method); //post
//name 属性可设置或返回表单的名称
var x = document.getElementById('myForm1');
alert(x.name); //myForm1
//Form 对象的方法
//reset() 方法可把表单中的元素重置为它们的默认值。
function reset1(){
document.getElementById("myForm2").reset();
}
*/
//submit() 方法把表单数据提交到 Web 服务器。
function Submit1(){
document.getElementById("myForm2").submit();
}
</script>
</html>