1 ///表单用 <form> 元素表示,对应的是 HTMLFormElement 类型,继承自 HTMLElement。
2 //属性:action、method、acceptCharset
3
4 ///【获取表单】
5 var form = document.getElementById('form1');//通过给<from>标签添加ID
6 var from2 = document.froms['form_name'];//通过<form>的name属性获得
7
8
9 ///【提交表单】
10 //浏览器将请求发送给服务器之前会触发 submit事件 ,这样就可以验证是否能提交
11 //注意 提交按钮的onsubmit无效
12 var form = document.forms['form'];
13 form.addEventListener('submit',function(event){
14 if(form.childern[0].getAttribute('value')<10){
15 alert('small');
16 event.preventDefault();
17 }
18 },false)
19
20 form.submit(); //提交表单,不会触发 onsubmit 事件
21 form.reset(); //重置表单,会触发 onreset 事件
22
23
24
25 ///【表单字段】
26 //访问表单字段
27 form.elements;//elements时所有表单元素的集合,非表单元素(p,a,div等)不在里面
28 form.elements[0];//取得表单的第一个字段
29 form.elements['user'];//取得name 为 user的字段。如果多个表单空间使用一个name(如单选按钮),那么就返回一个NodeList
30
31 //共有的表单字段属性
32 //type value disable(布尔值) readOnly(布尔值) 等等
33
34 //共有的表单字段方法
35 form.elements[0].focus();//让表单的某个元素获得焦点
36 form.elements[0].blur();//让表单的某个元素失去焦点
37
38 //共有的表单字段事件
39 //onblur失去焦点触发 onchange内容发生改变时触发 onfocus获得焦点触发
1 ///表单用 <form> 元素表示,对应的是 HTM