在Javascript 中，页面上的每一对<form> 标记都解析为一个对象，即form 对象。

可以通过document.forms 获取以源顺序排列的文档中所有form 对象的集合。

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 删除选项。