form.elements 是获取表单可提交控件最轻量标准方式，需确保控件有 name 属性、过滤 disabled 和非输入类元素，并正确处理 checkbox/radio 等同名多控件及结构化数据组装。
直接用 form.elements 是获取表单内所有可提交控件最轻量、最标准的方式，它不依赖框架、不触发重排，适合快速采集原始字段值。关键不是“能不能拿到”，而是“怎么拿得准、不漏、不错”。
确保表单和控件都带 name 属性
form.elements 只收集有 name 属性的控件（input、select、textarea 等），id 或 class 无效。缺失 name 的控件不会出现在集合中，哪怕它可见可编辑。
- 表单本身无需 id，但必须有
name="xxx"才能用document.forms["xxx"]定位 - 每个输入控件必须设
name="username"、name="email"等唯一名称，复选框组可用相同 name（如name="hobbies"） - 避免 name 值含空格、点号或特殊符号，否则通过
form.elements["my.name"]访问会出错，建议用中划线或驼峰
遍历 elements 时过滤无效项
form.elements 返回的是实时 HTMLCollection，包含所有带 name 的控件——包括 type="submit"、type="reset"、disabled 元素。它们的 .value 不代表用户输入，需主动排除。
- 跳过禁用项：
if (!el.disabled) - 跳过按钮类控件：
!["submit", "reset", "button"].includes(el.type) - 只取有实际输入意义的类型：
["text", "email", "number", "date", "textarea", "select-one", "select-multiple"] - 对
checkbox和radio，必须检查el.checked再读el.value
处理同名多控件（如复选框组）
当多个控件共用一个 name（例如一组 name="interests" 的 checkbox），form.elements["interests"] 返回的是 NodeList（不是单个元素），不能直接取 .value。
- 正确做法：转为数组后筛选已勾选项：
Array.from(form.elements["interests"]).filter(i => i.checked).map(i => i.value) - 单选组（
type="radio"）同理，但通常只需取第一个已选值：Array.from(form.elements["gender"]).find(i => i.checked)?.value - 避免写
form.elements["interests"].value—— 这会返回undefined或第一个元素的值，逻辑不可靠
构建结构化数据对象（推荐封装）
把遍历结果整理成键值对对象，便于后续校验、提交或传给 API，比零散读取更可控。
- 初始化空对象：
const data = {} - 循环
form.elements，按控件类型分支处理：
文本类直接赋值；
多选类聚合为数组；
select-multiple 也转数组；
radio 取首个选中值 - 示例片段：
for (const el of form.elements) {<br> if (!el.name || el.disabled) continue;<br> if (["checkbox", "radio"].includes(el.type)) {<br> if (el.checked) data[el.name] = el.value;<br> } else if (el.type === "select-multiple") {<br> data[el.name] = Array.from(el.selectedOptions).map(o => o.value);<br> } else {<br> data[el.name] = el.value;<br> }<br>}
