form属性使控件（如input、textarea等）在提交时归属指定表单，即使其不在标签内；需配合name属性才提交，disabled控件不提交，button[type="submit"]加form会强制提交目标表单。
input 的 form 属性不是“把控件拖进表单”，而是让浏览器在提交时，把它的值当作指定 form 的一部分发送——哪怕它物理上在 <form></form> 标签外面。
哪些元素能用 form 属性？
只有明确支持的控件才识别这个属性：input、textarea、select、button、output 和 label。其他标签比如 div、p、span 即使写了 form="xxx"，浏览器也直接忽略。
常见错误现象：
-
<div form="login"><input name="user"></div>——div加form没意义，必须加在input自身上 -
<label form="login">用户名</label>——label本身不带数据，不提交；它需要配合for和一个有name的控件才能起作用
form 属性必须配 name 才会提交
即使你写了 <input form="myform" name="email">，只要 name 是空字符串（name=""）或干脆没写，它就不会出现在 FormData 里，后端收不到。
立即学习“前端免费学习笔记（深入）”；
验证方法很直接：
- 运行
document.getElementById("myform").elements，看返回的集合里有没有那个外置控件 - 监听
submit事件，打印new FormData(event.target)，检查 key 是否存在、value 是否是你输入的内容 -
disabled的控件无论是否用form关联，都不会提交；readonly的则照常提交
button[type="submit"] 加 form 会强制提交目标表单
这是最容易引发意外的地方。默认情况下，<button type="submit"></button> 提交的是它最近的父级 <form></form>；但一旦加上 form="other-form"，它就完全无视 DOM 嵌套关系，强制提交指定的表单。
使用场景举例：
- 页面顶部一个通用搜索框（
input+button），想让它提交到底部的<form id="search"></form>，而不是它附近的某个登录表单 - 多个逻辑分组的控件分散在不同区域，但共用同一套提交逻辑和校验
- 避免把按钮硬塞进某个
form内部破坏语义结构或 CSS 布局
注意：button 的 form 属性只影响提交目标，不影响它的点击行为或样式。
兼容性和实际限制
form 是 HTML5 新增属性，IE 完全不支持，其他主流浏览器（Chrome、Firefox、Safari、Edge）都支持。如果你必须兼容 IE，就得靠 JS 模拟：手动收集控件值、构造 FormData、用 fetch 提交。
容易被忽略的关键点：
-
form和for完全是两回事：form是控件自己的属性，决定它“属于哪个表单”；for是label的属性，只控制点击聚焦 - 一个控件可以同时有
id、name、form、required等多个属性，互不冲突 - 表单重置（
reset）也会作用于所有通过form关联的控件，不只是 DOM 子节点
