合法HTML5表单结构须将输入框和按钮置于内，所有控件需有name属性，label与input通过for/id关联，button必须设type="submit"，且input类型应按语义选用（如email、tel等）。
怎么用
HTML5 要求表单控件必须在语义正确的上下文中工作， 不只是“视觉分组”，而是数据提交的容器。如果把 或 写在 外面，即使看起来排在一起，也可能导致：提交时拿不到值、无障碍阅读器无法识别关联、JS 里用 form.elements 查不到字段。
正确结构是：
-
name属性不能省——后端靠它收数据，没name的默认不参与提交 -
id和for要配对——点标签就能聚焦输入框，提升可访问性 -
button必须设type="submit"——否则点击不会触发表单提交（默认是type="button"）
input 类型选错会导致移动端键盘/校验异常
HTML5 提供了十多种 type 值，不只是 text 一种。选错类型，轻则弹出错误键盘（比如想输邮箱却弹出数字键盘），重则浏览器自动拦截非法值（如 type="number" 里输字母直接被忽略）。
-
type="email"→ 弹出带 @ 符号的软键盘，且提交前自动检查格式（但不验证域名是否存在） -
type="tel"→ 弹出电话键盘，无内置校验，适合国内手机号（别用number，它会删掉开头的 0） -
type="search"→ 输入框右侧自动加清空按钮，部分浏览器加搜索图标 -
type="password"→ 内容掩码，但不加密——仅前端遮蔽，传输仍需 HTTPS
注意：type="number" 在 Safari 上会强制显示上下箭头，且无法通过鼠标滚轮修改值；若只要数字输入，更稳妥的是 inputmode="numeric" + pattern="[0-9]*" 组合。
立即学习“前端免费学习笔记（深入）”；
按钮放哪？
两者都能提交表单，但行为细节不同。多数情况推荐用 。
-
：内容可以是 HTML（比如加图标），样式控制更自由 -
：只能是纯文本，value 无法含标签，CSS 伪元素（如::before）也不生效 - 如果按钮不在
内部，可以用form="myform"属性绑定：，对应
常见坑： 不写 type 属性时，某些老版本 IE 会当成 submit，现代浏览器默认是 button（不提交）。务必显式声明。
静态页没后端？用 onsubmit 拦截并读取值就够了
纯 HTML5 静态页没有服务器，action 提交会跳转或报 404。这时不需要删掉 ，只需用 JS 拦住默认行为，读取用户填的内容做下一步处理（比如发到第三方 API、存 localStorage、或仅做前端校验）。
注意：FormData 只收集有 name 的控件，且要求控件在 内；required 属性会触发浏览器原生提示，但只在调用 submit() 或点 submit 按钮时生效，JS 里用 FormData 不受其阻拦——校验逻辑得自己补。
最易被忽略的一点：所有交互都依赖用户是否真的「提交」了表单。如果只监听按钮 click，会漏掉回车提交；如果只监听 submit，又得确保按钮是 type="submit"。统一走 form.onsubmit 是最稳的路径。
