HTML表单关键在语义、属性与行为控制：name缺失导致后端收不到数据；method决定HTTP动词，敏感操作须用POST；type影响输入体验与校验；button需显式设type避免误提交；label嵌套提升可访问性；autocomplete需细粒度设置。
html 表单不是“写个 <form> 就能用”，关键在元素语义、属性配合和默认行为控制——漏掉一个 name，后端就收不到字段；少写一个 type="submit"，点击按钮可能只是刷新页面。
表单提交失败？先检查 name 和 method
浏览器只把带 name 属性的表单控件值发给服务器，value 再对也没用。同时，method 决定 HTTP 动词，默认是 GET，但登录、上传等必须用 POST。
-
input、select、textarea都必须有name，哪怕只是占位（如name="csrf_token"） -
method="POST"时，服务端要能处理application/x-www-form-urlencoded或multipart/form-data编码 -
GET提交会把数据拼在 URL 后，敏感信息（密码、token）绝对不能用
input 类型选错，用户输入和校验全乱套
type 不只是换图标，它决定键盘类型、输入限制、原生校验触发时机。比如 type="email" 在移动端弹出 @ 键盘，且浏览器会在 checkValidity() 时验证格式。
- 手机号别用
type="number"：它允许科学计数法、禁止开头 0，且会把值转成数字（丢失前导零）→ 改用type="tel" - 密码必须用
type="password"，否则明文暴露；需要显示明文时，动态切换type值，别用text硬顶 -
type="date"在 Safari 和旧版 Android 上支持差，没 polyfill 别依赖它的日历弹窗
按钮没反应？可能是 type 默认值在捣鬼
button 元素默认 type="submit"，放在 <form> 里点一下就提交；而 input 的默认 type 是 text，除非显式写 type="submit" 或 type="button"。
- 纯前端操作（如展开下拉、清空表单）的按钮，务必写
type="button"，否则可能意外触发表单提交 -
type="reset"会把所有控件重置为初始value，不是空值——如果初始没设value，就清成空，这点容易误判 - 禁用按钮用
disabled，别用pointer-events: none，后者不阻止表单提交逻辑
label 不包 input？点击体验和可访问性直接掉档
label 和控件关联不只是为了样式好看。屏幕阅读器靠 for 或嵌套关系识别标签，没关联就念不出“密码”对应哪个框；移动端点击 label 区域也等效于点 input，提升触控容错率。
立即学习“前端免费学习笔记（深入）”；
- 推荐嵌套写法：
<label>用户名<input name="username"></label>，比for/id更简洁不易错 - 复选框/单选组要用
fieldset+legend包裹，否则多个input共享一个label会导致语义混乱 - 隐藏 label 用
aria-label或aria-labelledby，别用display: none或visibility: hidden，它们会让辅助技术忽略
最常被跳过的其实是 autocomplete 属性——不加的话，现代浏览器可能自动填充错误字段（比如把邮箱填进电话框），加了 autocomplete="off" 又可能被忽略，得用更细粒度的值，比如 autocomplete="new-password" 或 autocomplete="shipping street-address"。
