一、表單的獲取方式

1.document.getElementById()

2.document.forms[index];

3.document.forms[form_name]

4.document.form_name

function testGetForm() {var frm = document.getElementById("regForm"); // 常用console.log(frm);frm = document.forms[0];console.log(frm);frm = document.forms["aaform"];console.log(frm);frm = document.aaform; // 常用,僅表單可以通過name屬性獲取console.log(frm);}

二、表單對象的屬性

action:表單提交的地址

method:表單的提交方式：get（默認）、post

get方式和post方式的區別

1.get方式會將提交的數據以（?name1=value1&name2=value2...）放在url后面
post方式會將數據以（name1=value1&name2=value2...）放在“請求實體”中

2.get將數據放在url后,由于url是有長度的,且url是可見,所以get方式不適合發送一些敏感數據
post方式將數據放在“請求實體”中，理論上是無限制，post方式適合發送一些敏感數據

3.get方式請求會有緩存
post方式請求不會有緩存

.enctype //表單的編碼方式application/x-www-form-urlencoded

enctype的值的區別

1.application/x-www-form-urlencoded（默認、且常用）
無論post方式還是get方式提交,表單數據均以(name1=value1&name2=value2...)組織數據

2.multipart/form-data（表單上傳文件時）
1)get方式，表單以(name1=value1&name2=value2...)組織數據
2)post方式，表單數據會放在類似于“------WebKitFormBoundaryGSF0lHBAvwWyAcuV”字符串中間.

3.text/plain
1)get方式，表單以(name1=value1&name2=value2...)組織數據
2)post方式，表單數據會以name1=value2，name2=value2，數據之間沒有連接符號

.elements //返回表單中所有的表單域(input button select textarea)對象的一個數組.
.length //返回表單中表單域對象的數量

function testFormField() {// 獲取表單var frm = document.aaform;console.log(frm.id);console.log(frm.name);//表單提交的地址console.log(frm.action); //表單的提交方式：get（默認）、postconsole.log(frm.method); //表單的編碼方式console.log(frm.enctype);//返回表單中所有的表單域（input button select textarea）對象的一個數組console.log(frm.elements); //返回表單中表單域對象的數量console.log(frm.length);}

三、表單對象的方法

frm.submit(); //提交表單

frm.reset(); //重置表單

四、表單對象的事件

1.對于表單中設置的提交、重置按鈕，會觸發onsubmit事件、onreset事件

2.在表單外部通過submit()提交表單不會觸發onsubmit事件

3.在表單外部通過reset()重置表單會觸發onreset事件