HTML原生form enctype="application/json"通过name属性语法解析嵌套结构：点号（.）生成嵌套对象，方括号（[]）生成数组或对象属性，索引需连续（缺位补null），非法格式如数字开头、单引号、连字符等将导致静默失败或扁平键名。
表单直接提交嵌套 JSON 时，name 属性不是任意写就能生成你想要的结构的——它有明确的解析规则，写错就得不到对象或数组，而是变成扁平字符串或 undefined。
form 的 enctype="application/json" 如何解析 name 属性
浏览器原生支持的 JSON 表单提交（仅现代浏览器），靠的是对 name 值的语法解析，不是靠 JS 手动序列化。它的规则是：
-
name="user.name"→ 解析为{"user": {"name": "xxx"}} -
name="hobby"（多个同名 input）→ 解析为{"hobby": ["reading", "coding"]} -
name="items[0].id"→ 解析为{"items": [{"id": "123"}]} -
name="data[1]"→ 解析为{"data": [null, "value"]}（注意：索引必须连续，否则中间补null） -
name="pet[species]"和name="pet[name]"→ 合并为{"pet": {"species": "...", "name": "..."}}
关键点：name 中的点号（.）和方括号（[]）是解析器识别嵌套和数组的唯一依据，不识别下划线、连字符或驼峰拼写本身。
name 出现非法字符或格式时的常见错误现象
一旦 name 写法不符合解析器预期，结果往往静默失败：
-
name="user-first-name"→ 不会生成嵌套，而是当成顶层键{"user-first-name": "xxx"} -
name="profile.address.city"但中间某层缺失（如没填profile.address的其他字段）→address可能为{}或undefined，取决于浏览器实现 -
name="items[].id"（空方括号）→ 多数浏览器忽略该字段，或报解析错误 -
name="data.1.text"（数字开头的属性名）→ 部分浏览器拒绝解析，生成无效 JSON 或跳过该字段 -
name='user["name"]'（用方括号加引号）→ 不被标准解析器识别，当作普通字符串键处理
这类问题不会抛 JS 错误，但后端收到的 JSON 结构与预期不符，调试时容易卡在“前端明明填了，后端却收不到”。
嵌套对象中键名必须用双引号包裹的硬性限制
即使你在 HTML 中写 name="config.timeout"，最终生成的 JSON 里，"config" 和 "timeout" 这两个键仍必须是双引号字符串——这是 JSON 规范强制要求，不是可选项：
{"config": {"timeout": 5000, "retry": true}}
这意味着：
- 不能写
name=config.timeout（省略引号）→ 浏览器可能忽略或解析失败 - 不能用单引号替代，如
name="config['timeout']"→ 不识别，等效于{"config['timeout']": "..."} - 若后端需要
camelCase键（如userName），必须写成name="userName"，而不是name="user_name"或name="user-name"—— 后者只会生成对应字符串键，不会自动转换
也就是说：name 的值决定 JSON 键名字面量，它是什么，最终 JSON 里就是什么，不经过任何命名转换。
数组索引命名与对象键名混用时的陷阱
当你要构造类似 {"steps": {"1": {...}, "2": {...}}} 这种「字符串数字键」的对象（非数组），name 无法直接表达——因为 name="steps[1]" 会被解析成数组，而非对象属性：
-
name="steps[1].text"→ 得到{"steps": [null, {"text": "..." }]}（索引 0 为空） - 想得到
{"steps": {"1": {"text": "..."}, "2": {"text": "..."}}}→ 必须放弃原生表单提交，改用 JS 构造对象后fetch发送，且steps必须声明为普通对象（{}），不能是数组（[]） - 试图用
name="steps.1.text"→ 大多数浏览器解析失败或忽略，因1是非法标识符（不能以数字开头）
这个边界最易被忽略：表单原生能力只覆盖「标准对象嵌套」和「数值索引数组」，不支持「字符串键对象」——哪怕键看起来像数字。
