HTML5常用的元素和属性,HTML5表单的元素和属性

html 原有的表单即表单控件

1.1 form元素：

form 元素用于生成表单，该元素不会生成可视化部分。

form元素可以指定 id、style、class等核心属性，还可以指定onclick等事件属性。除此以外还可以指定如下几个属性。1.action:指定当点击表单的“确定”按钮时，该表单被提交到那个地址。该地址可以指定一个绝对地址也可以指定一个相对地址。该属性必填。

2.method:指定提交表单时发出何种类型的请求。该属性必填

3.enctype:指定对表单内容进行编码所使用的字符集。

4.name:指定表单的唯一名称，建议该属性与id值保持一致。

5.target：指定使用那种方式打开目标url. GET方式的请求：该方式的请求会将请求参数的名称和值转换称字符串，并附加在url之后，因此可以在所在地址栏中看到请求参数名和值。且get请求传送的数值量较小，一般不能超过2KB。原因是受第三方限制。

POST方式请求：这种方式通常使用提交表单的方式来发送，POST方式传输的数据量较大，通常认为POST请求参数的大小不会受限制，但往往取决于服务器的限制，POST请求传输的数据量总比GET传输的数据量大。而且POST方式发送的请求参数以及对应的值在HTML HEADER中传输，用户不能在地址栏里看到请求参数值，安全性较高。

当在form元素里定义一个或多个表单控件时，一旦提交该表单，该表单里的表单控件将会转换为请求参数，关于该表单转换为请求参数的规则如下： 每个由name属性的表单控件对应一个请求参数，没有name的表单控件不会生成请求参数。

如果多个表单控件由相同的name属性，则多个表单控件只生成一个请求参数，只是该参数有多个值。

表单控件的name属性指定请求参数名，value属性指定请求参数值。

如果某个表单设置了disabled或disabled="disable"属性，则该表单不再生成请求参数。

1.2 input元素：

input元素是表单控件元素中功能最丰富的，如下几种输入元素都是通过input元素生成的。 单行文本框：指定input元素的type属性为text即可。

密码输入框：指定input元素的type属性为password即可。

隐藏域：指定input元素的type属性为hidden即可。

单选框：指定input元素的type属性为radio即可。

复选框：指定input元素的type属性为checkbox即可。

图像域：指定input元素的type属性为image即可。当type=“image”时，可以为input元素指定width和height两个属性。

文本上传域：指定input元素的type属性为file即可。

提交、重设、无动作按钮：分别指定input元素的type属性为submit、reset或button即可。

在上面的这些表单控件中，单行文本框、密码输入框都用于接收用户输入，而隐藏域不能接收用户输入，也不能生成可视化部分，它用于提交额外的参数请求，该请求参数的值就是隐藏域的value属性值。

单选框、复选框不能接收用户输入，因此定义他们时同时也会指定value属性值，用于设定他们所对应的请求参数的值。对于单选框、复选框而言，当他们勾选后，他们才会生成请求参数。

文本上传域会生成一个单行文本框，和一个“浏览”按钮，该文件上传域允许用户浏览本地磁盘文件，并将该文件上传到服务器。

input元素可以指定id、style、class等核心属性，也可以指定onclick等核心属性，还可以指定onfocus、onblur等焦点事件属性：。除此之外，还可以指定如下属性。 checked：设置单选框、复选框初始状态是否处于选中状态。该属性支持boolean值的属性，表示初始即被选中。只有当type属性为checkbox或video时才能指定该属性。

disabled：设置首次加载时禁用此元素。该属性支持boolean值的属性，表示该元素被禁用，该元素无法获取焦点、无法选中、无法在其中输入文本，无法相应鼠标点击、双击事件。当type=“hidden”时不能指定该元素。

浏览器并不是把from元素里所有的单选框都当成一组，而是把具有相同name属性的单选框当成一组，因此多个具有相同name的单选框只能选择其中一个;不同name的单选框之间互不干扰。

1.3使用label定义标签。

label元素用于在表单元素中定义标签，这些标签可以对其他可生成请求参数的表单控制元素(单行文本框、密码框等)进行说明。label元素不需要生成请求参数，因此不要为label元素指定value值。

label元素可以指定id、style、class、等属性，也可以指定onclick等事件属性。除此之外，还可以指定一个for属性，该属性指定该标签与那个表单控件关联。

让标签和表单控件关联有两种方式 隐式使用for属性：指定label元素的for属性值为所关联表单控件的id属性值。

显示关联：将普通文本、表单控件一起放在label元素内部即可。

尽量少使用显示关联的方式，这种方式在早期的Internet Explorer浏览器中没有很好的支持，当用户点击label元素对应的标签时，所关联的表单空间并不会获得输入焦点。

1.4 select和option元素

select元素用于创建列表框或下拉菜单，该元素必须和option元素结合使用，每个option元素代表一个列项或菜单项。

于其他表单控件不同的是，select属性本身并不指定value属性，列表框或下拉菜单控件对应的参数值由option元素来生成，当用户选中了很多列表项或菜单项后，这些列表项或菜单项的value值作为该select元素多对应的请求参数。

select元素指定id、style、class等核心属性，该元素仅可指定onchange事件属性------当该列表框或下拉列表项内的选中选项发生改变时，触发onchange事件。除此以外，select元素还可以指定如下几个属性。 disabled：设置禁用列表框或下拉菜单。该属性的值只能是disabled或省略属性值。

multiple：设置该列表框和下拉菜单是否允许多选。概述性支持boolean值的属性，即允许多选。一旦设置允许多选，select元素就会自动生成列表框。

size：指定该列表框内可同时宣示多个列表项。一旦指定该属性，select元素就会自动生成列表框。 一个select元素到底是生成列表框，还是生成下拉菜单，完全由是否指定了size和multiple属性来决定，只要有select元素指定了这两个属性之一，浏览器就会生成列表框，否在就是下拉菜单。

在select元素中，只包含如下两个子元素。

option：用于定义列表框选项或菜单项。该元素里只能包含文本内容作为选项的文本。

optgrop：用于定义列表项或菜单项组。该元素只能包含option子元素，处于optgroup里的option就属于该组。

option元素可以指定id、style、class等核心属性，还可以指定onclick等事件相应属性。除此之外，还可以指定如下几个属性。 disabled：指定禁用概属性，概述性的值只能是disabled

selected：指定该列表项初始状态是否处于被选中状态，该属性的值只能是selected。

value：指定该选项对应的请求参数。

optgroup：元素可以指定id、style、class等核心属性，可以指定onclick等事件相应属性。除此之外，还可以指定如下两个属性。 label:指定该选项组的标签，这个属性必填。

disabled：设置禁用该选项组里的所有选项。该属性值只能是disabled或者省略概述性。