在Javascript 中，頁面上的每一對<form> 標記都解析為一個對象，即form 對象。可以通過document.forms 獲取以源順序排列的文檔中所有form 對象的集合。

如果一個表單對象定義如下：

獲得該表單對象的方法：
  i>  document.forms["frm1"];   //根據name屬性值
 ii>  document.forms[0];        //根據索引號
iii>  document.frm1;            //直接根據name值獲得對象

form 表單應該注意的屬性：

elements：獲取以源順序排列的給定表單中所有控件的集合。但是<input  type="image" > 對象不在此集合內。

enctype：設置或獲取表單的多用途網際郵件擴展(MIME) 編碼。這個屬性的默認值為：application/x-www-form-urlencoded，如果要上傳文件，則應該設置為：multipart/form-data。

form 表單中的<label> 標記：

每一個表單元素的文字描述都應該使用<label> 標記！該標記用于將文字綁定到對應的表單元素上，它的for 屬性指定它所要綁定的表單元素id 值。綁定后單擊該文字，鼠標將聚焦到對應的文本框中或選中對應的選項。若安裝了某些桌面主題，某些表單元素還會變換顏色來予以提示，這大大提高了用戶體驗。

示例代碼：

效果如下：

注意：

i >    每個表單元素應當盡量使用<label>標簽來提高用戶體驗；

ii >   每個表單元素應當分配 name 屬性  和 id 屬性。

        name 屬性：用來將數據提交到服務器；

              id 屬性：用來在客戶端做相應的操作；如：<label>標簽的綁定、CSS 選擇器的使用等。 ( name 屬性和 id 屬性應該盡可能地使用相同的或相關的值。)

在客戶端，Javascript 對表單及表單元素的操作，更青睞于使用其name 屬性。因為，對于某些特定的表單元素(如：單選按鈕等)，使用其name 屬性更易于獲得元素值，也更方便向服務器傳送數據！

Javascript 操作form 表單元素，比較少用的屬性：

defaultChecked 設置或獲取復選框或單選鈕的狀態。
defaultValue 設置或獲取對象的初始內容。
disabled 設置或獲取控件的狀態。

提交表單的示例：

效果如下：

注意：

i >   如果使用submit( ) 方法來提交表單，則不會觸發<form> 表單元素的onsubmit 事件，這是與用<input  type="submit">提交元素不同的地方；

ii >  可以在按鈕的提交或點擊事件中，使用disabled 屬性來禁用用戶反復點擊提交按鈕的行為，減少服務器的響應負擔；

設置文本框

i >   控制文本框的字符個數

注意：多行文本框<textarea> 中的maxlength 為自定義屬性；如果在<textarea> 中輸入字符時，換行也算一個字符；

ii >  鼠標經過時，自動選中文本框，實現了行為與結構的分離。

設置單選按鈕

獲取選中的單選按鈕 & 設置單選按鈕被選中。需要保證同一組單選按鈕的name 屬性值相同即可。

設置復選框

設置復框的“全選”、“全不選”及“反選”功能

設置下拉列表框

下拉列表框的multiple 屬性用于設置或獲取下拉列表框是否可以選中多個選項。下拉列表框默認只能選中一項，若要設置為可以選中多項，則<select  multiple = "multiple"> 即可。

type 屬性：javascript 語言根據type 屬性的值獲得下拉列表框select 控件的類型。

type 屬性的值為：select-multiple 或 select-one （注意：下拉列表框的類型由multiple 屬性控制）

i >  查看下拉列表框的選項（單選項 & 多選項）

ii >  添加下拉列表框的選項

追加新選項到末尾：

插入新選項到指定位置：

注意：如果直接使用insertBefore( ) 方法插入選項，將會在IE 中出現一個空選項的bug。為了解決IE 的這個bug ，只能使用先追加新選項到末尾，然后再使用insertBefore( ) 方法將其移動到相應的位置。

類似這樣：為了跳過瀏覽器的某些bug 或限制，實現預定目的的小技巧，通常稱之為hack 。

iii >  替換某一選項

通過oBox.options[_num] = oOption 直接將創建的新選項替換掉指定位置的選項。

iv >  刪除某一選項

直接通過oBox.options[_num] = null 刪除選項。