HTML5表单必须用包裹控件，action和method属性指定提交目标与方式，name属性是数据提交必备，type="submit"按钮和验证属性（required/pattern等）需规范使用。
用 <form></form> 标签包裹所有表单控件
HTML5 表单必须以 <form></form> 元素为容器，否则浏览器无法识别提交上下文，submit 事件不会触发，且部分属性（如 autocomplete、novalidate）只在 <form></form> 上生效。
常见错误是直接写 <input type="text"> 而不包在 <form></form> 里，结果点击按钮没反应，控制台也无报错——本质是表单逻辑根本没启动。
-
action属性指定提交目标 URL，为空或省略时默认提交到当前页面（会刷新） -
method推荐显式写成method="post"或method="get"；GET 会把数据拼在 URL 后，适合搜索类操作；POST 更安全，适合含敏感信息或大体积数据的场景 - 加
id或name是为了 JavaScript 获取表单对象：document.getElementById("myForm")或document.forms["searchForm"]
必备字段：用 name 而非 id 传递数据
服务器接收不到表单值？大概率是因为写了 id="username" 却忘了 name="username"。HTTP 提交只认 name 属性，id 仅用于 CSS 或 JS 定位。
多个同名 name（如复选框）会自动合并为数组发送，例如：
立即学习“前端免费学习笔记（深入）”；
在调试 Java 后端 API 故障时使用此技能，尤其适用于以下任务：分析日志、跨 Controller、Service 和 Mapper 层追踪请求、定位异常根因、检查 SQL 执行或参数流转，以及生成简洁的诊断结论与修复方案。
<input type="checkbox" name="hobby" value="reading"> <input type="checkbox" name="hobby" value="coding">
提交后后端收到的是 hobby=["reading", "coding"]（具体格式依后端框架而定）。
- 文本类控件（
<input type="text">、<textarea></textarea>）必须有name才能提交 -
<button type="submit"></button>和<input type="submit">都可触发表单提交，但前者内容更灵活，后者兼容性略高 - 隐藏字段用
<input type="hidden" name="token" value="abc123">，它参与提交但不显示
HTML5 新增语义化输入类型与验证
用 type="email"、type="url"、type="number" 等不只是为了样式变化，它们带来三重价值：移动端弹出对应键盘、浏览器内置基础校验、无障碍支持增强。
但注意：这些验证是前端辅助，**不能替代后端校验**。用户禁用 JS 或手动修改 HTML 就能绕过。
-
required属性让字段必填，提交时浏览器自动提示（无需 JS） -
pattern支持正则，例如pattern="[A-Za-z]{3}"限制输入 3 个字母 -
min/max对number、date有效；minlength/maxlength对文本类有效 - 所有验证失败时，
checkValidity()方法返回false，可配合reportValidity()主动触发提示
避免踩坑：label 关联、提交按钮位置与 reset 的滥用
没点中输入框却触发了聚焦？大概率是 <label></label> 没正确绑定。推荐用 for 属性关联 id，而不是靠嵌套（嵌套在复杂布局中易失效）：
<label for="email">邮箱地址</label> <input type="email" id="email" name="email">
提交按钮放在 <form></form> 外部会导致无法提交（除非用 form 属性显式绑定），而 <input type="reset"> 容易误点清空全部内容，实际项目中极少使用，多数情况应由业务逻辑控制“重置”行为。
- 按钮不要只写
<button>提交</button>，必须加type="submit"，否则默认是type="button"，不触发表单提交 - 如果表单内有多个
<button></button>，不加type属性在某些浏览器中可能意外提交 - 禁用原生验证只需在
<form></form>上加novalidate，比逐个删required更高效
name 缺失、type="submit" 忘写、验证依赖前端这三点，是新人上线后最常被测试同学揪出来的线上问题。 
