1.表单简介
表单，接触动态页面的第一步,作用是在客户端收集用户的信息，然后将数据递交给服务器来处理。
2.表单form标签
语法:
<form>表单各种标签</form> 这里的表单指的是文本框、按钮、下拉列表等的统称。表单form也是一种块元素，不能与其它元素共存于一行。
<1>.标签属性
五个重要的属性
name
表单名称属性,当表单不止一个时，使用name属性来给表单进行命名，这样也可避免表单提交后在后台程序中出现混乱。
语法：
<form name="表单名称"></form>表单名称中不能包含特殊字符和空格
action
提交表单属性，用于指定表单数据提交到哪个地址进行处理。
语法：
<form action="表单的处理程序">...</form>处理程序是表单要提交的地址，这个程序地址用来处理从表单搜集的信息。
这个地址可以是相对地址，也可以是绝对地址，还可以是一些其它形式的地址。
ex:
<form name="pigsForm" action="mailto:[email protected]"></form>上述action表示使用邮件形式进行提交。
method
传送方法属性，作用是告诉浏览器指定将表单中的数据使用哪一种HTTP提交方法，取值为get或post.
| 属性值 | 说明 | 特征 |
|---|---|---|
| get | 默认值,表单数据被传送到action属性指定的URL,然后这个新URL被送到处理程序上 | 安全性较差，所有的表单域的值都直接显示出来了 |
| post | 表单数据被包含在表单主体中，然后被传送到处理程序上 | 除了可见的脚本处理程序之外，其他的信息都可以隐藏，通常选择这种方式。 |
语法：
<form method="传送方法">...</form>target
目标显示方式属性，用来指定目标窗口的打开方式。参考a标签中的target属性。
| 属性值 | 语义 |
|---|---|
| _self | 默认方式，在当前窗口打开页面 |
| _blank | 在一个全新的空白窗口中打开页面 |
| _top | 表示页面载入到包含该链接的窗口，取代当前在窗口中的所有页面 |
| _parent | 表示在父级窗口中打开页面 |
enctype
编码方式属性，用以设置表单信息提交的编码方式。
| 属性值 | 说明 |
|---|---|
| application/x-www-form-urlencoded | 默认的编码方式 |
| multipart/form-data | MIME编码，对于“上传文件”这种表单必须选择该值 |
<2>.表单对象
指放在<form></form>标签内的各种标签。
共有四种:
- input,
- textarea,
- select,
- option
注：这四种标签也可以放在form标签外面,如需要提交表单数据则必须放在form标签内部。
3.input标签简介
语法：
<input type="表单类型"/>自闭合标签,也可放在form之外的地方。
| type属性值 | 说明 |
|---|---|
| text | 单行文本框 |
| password | 密码文本框 |
| button | 按钮 |
| reset | 重置按钮 |
| image | 图像形式的提交按钮 |
| radio | 单选按钮 |
| checkbox | 复选框 |
| hidden | 隐藏字段 |
| file | 文件上传 |
4.单行文本框text
<1>.简介
语法：
<input type="text"/>
<2>.text属性
| 属性 | 说明 |
|---|---|
| value | 定义文本框的默认值，也就是文本框内的文字 |
| size | 定义文本框的长度，以字符为单位 |
| maxlength | 设置文本框中最多可以输入的字符数 |
对于元素属性的设置，是没有先后顺序，input还有一个name属性，一般情况下使用id属性，而很少使用name属性。
5.密码文本框password
<1>.简介
属性与单行文本框一致，只是密码输入框的字符是不可见的。
<2>.属性
与单行文本框text一致
6.单选按钮radio
<1>.简介
单选按钮radio只能从选项列表中选择一项，选项1与选项2是互斥。
语法:
<input type="radio" name="单选按钮所在的组名" value="单选按钮的取值"/>说明：
name和value是单选按钮必要的两个属性，必须要设置。
<2>.易忽略点
- 注意如果是同一组的按钮必须指定同一个name属性，否则就会出现两个按钮都可选的情况。
- value属性是为了便于向服务器传递数据，所以需要该属性。
7.复选框checkbox
复选框可从选项列表中选择一项或者多项。
语法：
<input type="checkbox" value="复选框取值" checked="checked"/>checked属性表示该选项在默认情况下已经被选中。value的作用与单选按钮一致。
HTML中的复选框是没有文本的，需要加入label标签，并且用label标签的for属性指向复选框的id.
8.表单按钮
<1>.普通按钮button
在HTML中，该按钮一般情况下要配合JavaScript脚本来进行表单的实现。
语法：
<input type="button" value"普通按钮的取值" οnclick="JavaScript脚本程序"/>value的取值就是显示在按钮上的文字，onclick是普通按钮的事件js执行。
<2>.提交按钮summit
一种具有特殊功能的普通按钮，单击按钮 可以实现将表单内容提交给服务器处理
语法：
<input type="summit" value"提交按钮的取值"/><3>.重置按钮reset
单击重置按钮可以清除用户在页面表单中输入的信息。
语法：
<input type="reset" value"重置按钮的取值"/>这里需要注意的是reset只能清除当前所在form标签内部表单元素的输入内容，
对当前所在form标签之外的表单元素无效。
9.图片域
语法：
<input type="image" src="图像的路径"/>虽然可以用图片域实现好看的按钮，但不推荐这种做法。
前端开发，有一个不成文的规定，能用CSS实现的就不要用图片来实现。因为图片会影响页面的加载速度，相反CSS只用少量代码即可实现相同效果。
10.隐藏域hidden
向服务器传输一些不想让用户看见的数据，隐藏域中包含那些要提交的数据，但这些数据并不显示在浏览器中。
语法:
<input type="hidden"/>注意隐藏域可以在HTML源代码中看到。
11.文件域file
用以实现文件上传功能。
语法：
<input type="file"/>注意该表单的form中必须使enctype属性值为”multipart/form-data”
12.多行文本框textarea
可以输入多行信息
语法：
<textare rows="行数" cols="行数">多行文本框内容</textarea>.说明：
不能像单行文本框那样使用value属性来设置多行文本框的默认值，如须添加可直接在标签内部添加。
13.下拉列表select
下拉列表由select和option这两个标签配合使用，该特点与列表类似。
语法：
<select>
<option>选项显示的内容</option>
....
<option>选项显示的内容</option>
<select><1>.select标签属性
| 属性 | 说明 |
|---|---|
| multiple | 可选属性，只有一个属性值”multiple”,默认情况下列表只能选一项，设置该值后可按ctrl+鼠标左键选取。 |
| size | 下拉列表展开之后可见列表项的数目 |
<2>.option标签属性
| 属性 | 说明 |
|---|---|
| value | 选项值 |
| selected | 是否选中 |
value主要是用来给javascript调用的，或者向服务器传递数据。
14.示例链接,右键可查看源码
