9.1 表单简介

在HTML中，<form></form>标记对用来创建一个表单，即定义表单的开始和结束位置，在标记对之间的一切都属于表单的内容。

表单可用于搜索、登录、投稿之类的。比如杨青青博客上的搜索和登录就使用了表单。用户填写信息后，才能将数据进行传输给程序处理。

登录注册表单

搜索表单

我们都知道表格的行、列及单元格需要放在 <table></table> 标签中，表单里的元素也不例外，同样需要放在 <form></form> 标签中。<form> 标签有几个常用的属性，见下表：

<form> 标签的常用属性

常用属性	属性值	说明
action	url	用户点击提交按钮时，表单被提交到的位置。
method	get / post	表单提交时所使用的 http 请求方法，只能是 get 或 post 中的任意一种。
name	自定义	表单的名称，不能包含特殊字符和空格。

具体语法如下：

<form action="url" method="post" name="formName"></form>

此处method使用提交方法为post，还可以设置为get。我们来看一下两者之间有什么区别：

1、get ：用户点击提交按钮后，提交的信息会被显示在页面的地址栏中。一般情况下，get提交方式中不建议包含密码，因为密码被提交到地址栏，不安全。

get 方式提交后地址栏的变化

2、post：如果表单包含密码这种敏感信息，建议使用post方式进行提交，这样数据会传送到后台，不显示在地址栏中，相对安全。

post方式提交后地址是不能看到form表单填写的内容

<form> 标签的所有属性

属性	值	描述
accept	MIME_type	HTML 5 中不支持。
accept-charset	charset_list	规定服务器可处理的表单数据字符集。
action	URL	规定当提交表单时向何处发送表单数据。
autocomplete	on off	规定是否启用表单的自动完成功能。
enctype	见说明	规定在发送表单数据之前如何对其进行编码。
method	get post	规定用于发送 form-data 的 HTTP 方法。
name	form_name	规定表单的名称。
novalidate	novalidate	如果使用该属性，则提交表单时不进行验证。
rel	external help license next nofollow noopener noreferrer opener prev search	规定链接资源和当前文档之间的关系。
target	_blank _self _parent _top framename	规定在何处打开 action URL。

表单元素

表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。

表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。

在接下来的章节中，我们会讲到常用的表单元素，一些不常用的表单元素，可以作为一个简单的了解即可，因为平时我们用到的很少。