checked属性必须直接写在html标签中（如checked），不带等号和值，才能控制首次加载默认选中；js赋值.checked=true仅改变运行时状态，不影响初始渲染。
必须在 HTML 标签里写 checked，仅靠 JS 赋值不会影响首次加载时的默认状态。
HTML 中 checked 属性怎么写才真正生效
直接在 <input type="checkbox"> 标签里加 checked，不带等号、不带引号、不写值——浏览器就认。比如：<input type="checkbox" name="notify" value="email" checked>。
常见错误包括：
- 写成
checked="true"或checked="checked"：虽多数浏览器兼容，但语义错误，W3C 规范只要求属性存在 - 误用
selected：那是<option></option>的属性，对 checkbox 完全无效 - 服务端模板渲染时，把布尔判断写错，例如 Django 模板中写成
{% if user.subscribed %}checked{% endif %}，但user.subscribed是字符串"0"，仍会被当成真值插入checked
document.querySelector(...).checked = true 为什么没用
JS 赋值只改运行时状态，不改变初始渲染快照。页面一加载，浏览器就按 HTML 中有没有 checked 属性来决定“默认选中”；后续 JS 修改只是切换当前状态，不影响“默认”含义。
典型翻车场景：
- 元素还没挂载到 DOM 就执行
el.checked = true（比如刚createElement完） - 框架（Vue/React）已接管表单，硬写
checked属性被忽略，应改用v-model或checked={state}+onChange - 想触发联动逻辑（如显示隐藏区块），但只设
.checked = true不会触发change事件，得手动el.dispatchEvent(new Event('change', { bubbles: true }))
提交表单时，checked 状态怎么影响后端接收
浏览器只把 .checked === true 的 checkbox 的 value 发出去；未勾选的，字段压根不出现——不是传空或 null，是彻底消失。
这意味着：
- 后端收不到 “用户没选 A” 这个信息，只能靠业务约定（比如默认全不选，或额外加隐藏域）
- 如果没设
value，勾选后默认提交字符串"on"，不是布尔值，容易被后端误判 - 用
FormData收集时，同名 checkbox 会自动合并为数组，但前提是它们都勾选了；没勾的不会进 FormData
最容易被忽略的一点：默认状态和运行时状态是两套逻辑——HTML 的 checked 控制“第一次打开页面时长什么样”，而 JS 的 .checked 或框架的响应式数据控制“之后它变成什么样”。混用却不理解边界，八成出问题。
