原生js操作form的一些方法，来看下面写的这个demo,这个demo是展示了一下form.eleemnts[i]的意义和用法：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>form.elements</title> 6 </head> 7 <body> 8 <div class="wrap"> 9 <form> 10 <p> 11 <label for="username"> 12 用户名： 13 </label> 14 <input type="text" placeholder="请输入用户名"> 15 </p> 16 <p> 17 <label for="psw"> 18 密码： 19 </label> 20 <input type="text" placeholder="请输入密码"> 21 </p> 22 <p><input type="submit" value="登录"></p> 23 </form> 24 <form> 25 <p> 26 <label for="username"> 27 用户名： 28 </label> 29 <input type="text" placeholder="请输入用户名" value="xiaoming"> 30 </p> 31 <p> 32 <label for="psw"> 33 密码： 34 </label> 35 <input type="text" placeholder="请输入密码" value="123455"> 36 </p> 37 <p> 38 <label for="pswok"> 39 密码： 40 </label> 41 <input type="text" placeholder="请输入密码" value="123455"> 42 </p> 43 <p><input type="submit" value="注册"></p> 44 </form> 45 </div> 46 <script> 47 window.onload = function(){ 48 var form1 = window.document.forms[0]; 49 var form2 = window.document.forms[1]; 50 document.write("form1的长度："+form1.length+"------"+"form2的长度："+form2.length+"<br />"); 51 52 //需求：打印form2中所有input的value与input 53 for(var i=0; i<form2.length; i++){ 54 document.write(form2.elements[i].value); 55 document.write("<br />"); 56 document.write(form2.elements[i].type); 57 document.write("<br />"); 58 } 59 60 // 需求：循环遍历，如果input的type==text,则清空input的value值 61 for(var i=0; i<form2.length; i++){ 62 if(form2.elements[i].type == 'text'){ 63 form2.elements[i].value ='' 64 } 65 } 66 } 67 </script> 68 </body> 69 </html>
感兴趣的，多练习一下，就明白我们获取form的方法和form.elements[i]的意义了，希望这个demo对你有所帮助。