form属性使表单控件逻辑归属指定form元素，仅input、textarea、select、button、output、label支持；需配合name属性才能提交，disabled控件不提交，form与for作用完全不同。
form 属性不是“移出表单”，而是让控件**逻辑归属**某个 <form></form>，哪怕它 DOM 上完全不在那个 <form></form> 标签内部。它解决的是布局自由和语义完整之间的矛盾，不是视觉位移操作。
哪些元素能用 form 属性？
只有明确支持的表单控件才识别该属性：<input>、<textarea></textarea>、<select></select>、<button></button>、<output></output> 和 <label></label>。其他标签如 <div>、<code><span></span>、<p></p> 即使写了 form="xxx"，浏览器也直接忽略——不会报错，也不会生效。
常见错误现象：<div form="login"><input name="user"></div> 中的 <div> 加 <code>form 没意义，真正要加的是 <input> 自身。
form 属性必须配 name 才能提交
即使控件通过 form="myform" 正确关联到表单，如果它没有 name 属性，或 name=""，那它在 FormData 里就完全不会出现。这是最常被忽略的硬性条件。
立即学习“前端免费学习笔记（深入）”；
验证方法很简单：
document.getElementById("myform").elements
看返回的集合里有没有你那个外置控件；再监听 submit 事件，打印：
new FormData(event.target)
检查 key 是否存在、value 是否是你输入的内容。
注意：disabled 的控件无论是否用 form 关联，都不会提交；readonly 的则照常提交。
form 和 for 完全不是一回事
form 是控件自己的属性（比如 <input form="login">），决定它“属于哪个表单”，影响提交、重置、form.elements 遍历；
for 是 <label></label> 的属性（比如 <label for="user"></label>），只控制点击时聚焦或切换目标控件，不参与表单数据流。
一个控件完全可以三者共存：
<input id="user" name="username" form="login"><label for="user" form="login">用户名</label>
这里 <label></label> 的 form 属性让它「代表的控件」参与 login 表单提交，但点击 label 本身仍只触发聚焦，不会触发表单 submit。
button[type="submit"] 加 form 会改变提交目标
这是最容易引发意外行为的地方。默认情况下，<button type="submit"></button> 提交的是它最近的父级 <form></form>；但一旦加上 form="other-form"，它就会无视物理嵌套关系，强制提交指定的表单。
多个表单混排时尤其危险：
- 表单 A 里放了一个
<button form="B"></button>，点它会提交表单 B，而不是 A - 表单 B 里没放 submit 按钮，全靠表单 A 里的这个“越界按钮”驱动
- 如果表单 B 的
id写错或不存在，点击按钮无反应，也不报错——静默失败
这种跨表单控制能力很强大，但调试时得盯紧 form 值和对应 <form id></form> 是否真实存在且大小写一致。
