表单必须设置name属性，否则后端无法接收数据；method应优先选post以保障安全；input type需按语义正确选用；button需显式声明type避免误提交；label与name缺一不可。

表单不是“写个 <form></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、有长度限制、会被缓存和书签保存。

anything-to-html

将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。

下载

• 登录、注册、修改密码、上传文件 → 必须用 method="POST"
• POST 提交时，服务端要能处理 application/x-www-form-urlencoded（普通表单）或 multipart/form-data（含文件）
• 搜索类轻量操作（如站内检索）可用 GET，方便分享链接和浏览器前进/后退
• 别信“GET 更快”——性能差异可忽略，安全与语义才是关键

input 的 type 别乱选，否则体验和校验全崩

type 不只是换图标，它决定键盘类型、输入限制、原生校验触发时机，甚至值的类型。

• 手机号别用 type="number"：允许科学计数法、禁止开头 0、值被转成数字（丢失前导零）→ 改用 type="tel"
• 密码必须用 type="password"；需要“显示明文”时，动态切换 type 值，别硬写 type="text"
• type="date" 在 Safari 和旧 Android 上支持差，没 polyfill 别依赖它的日历弹窗
• type="email" 会触发浏览器级格式校验（checkValidity()），但不能替代后端验证

button 没反应？很可能是 type 默认值在捣鬼

<button></button> 默认 type="submit"，放在 <form></form> 里点一下就提交；<input> 默认 type="text"，除非显式声明。

• 纯前端操作（如展开下拉、清空表单）的按钮，务必写 type="button"，否则可能意外提交
• type="reset" 会把所有控件重置为初始 value，不是清空——如果初始没设 value，才变成空
• 禁用按钮用 disabled 属性，别用 pointer-events: none，后者不阻止表单提交逻辑

最容易被忽略的其实是 label 和 name 的配合：没 label 关联，屏幕阅读器读不出字段含义；没 name，后端连字段名都收不到——这两处出错，表单就废了一半。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！