共计 1737 个字符，预计需要花费 5 分钟才能阅读完成。
表单的用途非常广泛，比如电子邮箱、用户注册登录、网上搜索等，简单来说，表单是一个将用户信息阻止起来的容器；
一、表单标签及属性
<form> 标签就是表单标签，该标签用于在网页中创建表单区域，属于一个容器标签；
action：表单的属性之一，用于指示服务器上处理表单输出的程序；
method：表单属性之一，此属性告诉浏览器如何将数据发送给服务起，指定向服务器发送数据的方法，是用 post 或者 get；
<form action=”#” method=”post”>
<p> 密码：<input type=”text” name=”pwd”></p>
<p>
<input type=”submit” value=” 提交 ”/>
<input type=”reset” value=” 重填 ”/>
</p>
</form>
二、GET 方法和 POST 方法的区别
Get 方法：
GET 请求可被缓存；
GET 请求保留在浏览器历史记录中；
GET 请求可被收藏为书签；
GET 请求不应在处理敏感数据时使用；
GET 请求有长度限制；
GET 请求只应当用于取回数据；
POST 方法：
POST 请求不会被缓存；
POST 请求不会保留在浏览器历史记录中；
POST 不能被收藏为书签；
POST 请求对数据长度没有要求；
三、表单元素
<form action=”#” method=”post” style=”margin:0 auto;width: 1000px;margin-top:100px;”>
<p> 姓名：<input type=”text” /></p>
<p> 邮箱：<input type=”text” /></p>
<p> 地址：<input type=”text” /></p>
<p> 性别：男 <input type=”radio” checked/> 女 <input type=”radio”/></p>
<p> 爱好：篮球 <input type=”checkbox” /> 羽毛球 <input type=”checkbox” checked/> 足球 <input type=”checkbox”/></p>
<p> 今天星期：
<select name=”weekday” size=”1″>
<option value=”1″> 星期一 </option>
<option value=”2″> 星期二 </option>
<option value=”3″ selected> 星期三 </option>
<option value=”4″> 星期四 </option>
<option value=”5″> 星期五 </option>
<option value=”6″> 星期六 </option>
<option value=”7″> 星期七 </option>
</select>
</p>
<p> 密码：<input type=”password” /></p>
<p> 确认密码：<input type=”password” /></p>
<p>
<input type=”submit” value=” 提交按钮 ”/>
<input type=”reset” value=” 重填按钮 ”/>
<input type=”button” value=” 普通按钮 ”/>
</p>
</form>
以上代码的演示结果图为：
（1）<input> 标签
type 属性：指定表单元素的类型，可选项有 text、password、checkbox、radio、submit、reset、file、hidden、image 和 button，默认为 text；
name 属性：指定表单元素的名称；
value 属性：可选，指定表单元素的初始值；
checked：指定按钮是否被选中；
size 属性：指定表单元素的初始宽度；
maxlength 属性：指定可在 text 或 password 元素中输入的最大字符数；
（2）三种按钮
reset 按钮：重置按钮，将表单重置为最初状态；
submit 按钮：提交按钮，用户单击按钮后，表单将会提交到 action 属性所指的 URl，并传递表单数据；
button 按钮：普通按钮，需要与事件关联使用；
四、表单的只读与禁用设置
readonly：只读，网站服务器方不希望用户修改的数据，这些数据在表单元素中显示；
disabled：禁用，只有满足某个条件后，才能选用某项功能；
禁用的表单不会被提交；
