表单必须设置name属性，否则后端无法接收数据；method应优先选POST以保障安全；input type需按语义正确选用；button需显式声明type避免误提交；label与name缺一不可。
表单不是“写个 <form> 就能用”，漏掉 name，后端就收不到数据；没设 type="submit"，点按钮可能只是刷新页面。
为什么表单提交后后端收不到字段？
浏览器只把带 name 属性的控件值发给服务器——value 再对、输入再全，没 name 就等于没传。
-
<input type="text">必须加name="username"，不能只写id或class - 单选组（
radio）靠name归属同一组，不同组必须用不同name - 复选框（
checkbox）如果想批量提交，也得统一name，比如name="hobby"，后端才能收到数组 - 哪怕只是占位字段（如 CSRF token），也要写
<input type="hidden" name="csrf_token" value="xxx">
method="GET" 还是 method="POST"？
默认是 GET，但绝大多数用户操作不该用它：数据暴露在 URL、有长度限制、会被缓存和书签保存。
- 登录、注册、修改密码、上传文件 → 必须用
method="POST" -
POST提交时，服务端要能处理application/x-www-form-urlencoded（普通表单）或multipart/form-data（含文件） - 搜索类轻量操作（如站内检索）可用
GET，方便分享链接和浏览器前进/后退 - 别信“
GET更快”——性能差异可忽略，安全与语义才是关键
input 的 type 别乱选，否则体验和校验全崩
type 不只是换图标，它决定键盘类型、输入限制、原生校验触发时机，甚至值的类型。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- 手机号别用
type="number"：允许科学计数法、禁止开头 0、值被转成数字（丢失前导零）→ 改用type="tel" - 密码必须用
type="password"；需要“显示明文”时，动态切换type值，别硬写type="text" -
type="date"在 Safari 和旧 Android 上支持差，没 polyfill 别依赖它的日历弹窗 -
type="email"会触发浏览器级格式校验（checkValidity()），但不能替代后端验证
button 没反应？很可能是 type 默认值在捣鬼
<button> 默认 type="submit"，放在 <form> 里点一下就提交；<input> 默认 type="text"，除非显式声明。
- 纯前端操作（如展开下拉、清空表单）的按钮，务必写
type="button"，否则可能意外提交 -
type="reset"会把所有控件重置为初始value，不是清空——如果初始没设value，才变成空 - 禁用按钮用
disabled属性，别用pointer-events: none，后者不阻止表单提交逻辑
最容易被忽略的其实是 label 和 name 的配合：没 label 关联，屏幕阅读器读不出字段含义；没 name，后端连字段名都收不到——这两处出错，表单就废了一半。
