HTML form 语法
在 HTML 中，form 标签用于创建一个表单。表单用于供用户输入信息，然后提交给服务端处理。它通常包括各种文本框、单选按钮、复选框等表单元素。
语法：
<form>
……各种表单标签
</form>说明：
form 标签的属性有很多，常用的如下表所示。
| 属性 | 说明 |
|---|---|
| name | 表单名称 |
| method | 提交方式 |
| action | 提交地址 |
| target | 打开方式 |
| enctype | 编码方式 |
| autocomplete | 是否启用自动填充 |
| novalidate | 是否跳过 HTML5 验证 |
1. name 属性
在一个页面中，表单可能不止一个，每一个 form 标签就是一个表单。为了区分这些表单，我们可以使用 name 属性来给表单进行命名。
<form name="myForm1"></form>
<form name="myForm2"></form>
<form name="myForm3"></form>2. method 属性
在 form 标签中，method 属性用于指定表单数据使用哪一种 HTTP 提交方法。method 属性取值有 2 个："get" 和 "post"。
get 的安全性较差，而 post 的安全性较好。所以在实际开发中，大多数情况下都是使用 post。
<form method="post"></form>3. action 属性
在 form 标签中，action 属性用于指定表单数据提交到哪一个地址进行处理。
<form action="index.php"></form>4. target 属性
form 标签的 target 属性跟 a 标签的 target 属性是一样的，都是用来指定窗口的打开方式。target 默认值为 "_self"（在当前窗口打开），如果需要以新窗口打开，可以设置为 "_blank"。
<form target="_blank"></form>5. enctype 属性
在 form 标签中，enctype 属性用于指定表单数据提交的编码方式。一般情况下，我们不需要设置，除非你用到上传文件功能，并且必须将 enctype 设置为 "multipart/form-data"。
<form enctype="multipart/form-data"></form>6. autocomplete 属性
在 form 标签中，autocomplete 属性用于设置表单中的输入字段是否启用自动填充功能。
on（默认值）：启用自动填充。此时浏览器会自动填充用户之前输入过的值。off：禁用自动填充。
<form autocomplete="off"></form>7. novalidate 属性
在 form 标签中，novalidate 属性是一个布尔属性，用于设置提交表单时是否跳过 HTML5 验证（如必填项、邮箱格式等）。
- 不写该属性（默认）：进行 HTML5 验证。
- 写上该属性：跳过（禁用） HTML5 验证。
<form> ... </form>
<form novalidate> ... </form>HTML form 摘要
| 属于 | HTML 表单 |
|---|---|
| 使用频率 | 高 |
| 兼容性 | 查看 |
| 官方文档 | 查看 |
| MDN | 查看 |
HTML form 示例
接下来，我们通过一个简单的例子来讲解一下 HTML form 标签是如何使用的。
示例：form 标签的基本用法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form action="/submit" method="post">
<p>
<label>用户：<input type="text" name="username" placeholder="请输入用户名"></label>
</p>
<p>
<label>简介：<textarea name="bio">这是一个多行文本框</textarea></label>
</p>
<p>
<label>擅长语言：
<select name="language">
<option value="html">HTML</option>
<option value="css">CSS</option>
<option value="js">JavaScript</option>
</select>
</label>
</p>
<p>
<button type="submit">提交</button>
</p>
</form>
</body>
</html>页面效果如下图所示。
分析：
input、textarea、select、option 都是表单标签，一般要放在 form 标签内部。
HTML 表单的常见问题
1. 表单元素那么多，而且每一种元素自身还有好几个属性，应该怎么记忆呢？
对于初学者来说，表单记忆是最关心也是最为头疼的一件事。在 HTML 入门时，我们不需要花太多时间去记忆这些标签或属性，只需要感性认知即可。忘了的时候，就回来翻一下。此外，像 VSCode 等也会有代码提示，写多了自然就会记住了。
2. 表单元素是否一定要放在 form 标签内呢？
表单元素不一定都要放在 form 标签内。对于要与服务器进行交互的表单元素就必须放在 form 标签内才有效。如果表单元素不需要跟服务器进行交互，那就没必要放在 form 标签内。
3. form 标签可以包含哪些表单元素？
实际上，form 标签可以包含以下表单元素。
