表单提交严格限定于当前内部控件，不跨表单收集数据；所谓“跨表单取值”实为手动DOM查询拼接，非原生行为；合并逻辑相关字段应统一置于同一内，通过CSS实现视觉分离。
不能跨表单提交，也就不存在“抓取”一说；所有提交值只来自当前 <form></form> 内部的控件。 你看到的“跨表单取值”，本质是手动 DOM 查询 + 拼数据，不是表单原生行为。
为什么 form.submit() 不会包含其他表单的字段
浏览器原生提交机制严格绑定 <form></form> 边界：只有该标签内、有 name 属性、且非 disabled 的控件才会被收集。其他表单里的 <input name="price"> 对当前提交完全透明。
- 常见翻车现场：
<form action="/submit"><button type="submit">Start</button></form>点击后发空请求，因为里面没任何name字段 - 另一个表单里写了
<input name="price" value="99">？它只属于自己的<form></form>，不会自动“溢出”过去 - 用
fetch或XMLHttpRequest手动拼数据时，才需要你自己去document.querySelector找值——但这已脱离表单提交语义
想合并多个区域的输入，该怎么做
别硬凑“跨表单”，把逻辑上属于同一操作的字段，物理上放进同一个 <form></form> 标签里。这是最稳、最符合规范的做法。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 如果 UI 上必须视觉分离（比如价格在顶部、配置在中部），可用 CSS 布局实现，但 DOM 结构仍保持一个
<form></form> - 避免用
form="form-id"属性把分散的控件强行关联——它只影响提交时是否参与收集，不解决“不同表单 DOM 节点无法共享上下文”的根本问题 - 动态插入的字段，确保插入后仍在目标
<form></form>内部，否则FormData或form.elements都看不到它
手动提取多区域字段时的坑
真要绕开表单边界手动取值，document.querySelectorAll 是唯一通用路径，但容易漏掉关键状态判断。
立即学习“前端免费学习笔记（深入）”；
- 复选框/单选按钮必须检查
checked，否则.value永远返回初始值，不是用户选择结果 -
<select multiple></select>要遍历selectedOptions，而不是只读value（后者只返回第一个选中项） - 带
disabled的控件，即使有name，也不应纳入业务数据——但querySelectorAll('[name]')会把它捞出来，得额外过滤 - 中文输入法下，
input的value可能在compositionstart到compositionend之间滞后，监听input事件比change更及时
最常被忽略的点：你以为在“提交表单”，其实只是点击了一个按钮；真正决定哪些值被发送的，是那个按钮所属的 <form></form> 的闭合位置，而不是它离哪个输入框更近。
