多选框默认勾选需在<input type="checkbox">标签添加checked布尔属性，如<input type="checkbox" checked>；写成selected或default无效，且React/Vue中须用defaultChecked或v-model控制。
多选框（checkbox）怎么默认勾上几个？
直接在对应 <input type="checkbox"> 标签上加 checked 属性就行，浏览器原生支持，不需要 JS。
常见错误是写成 selected 或 default——这两个对 checkbox 完全无效，浏览器会静默忽略，控制台也不报错，只是“看起来没反应”。
-
checked是布尔属性，写上就生效，不带等号和值：<input type="checkbox" name="tag" value="js" checked> - 多个 checkbox 可以各自独立加
checked，互不影响；不像 radio 那样靠name分组约束 - 服务端模板里别直接插变量，比如 PHP 写成
checked="{{ $user->newsletter }}"：哪怕值是字符串"0"或"false"，HTML 也会渲染出checked属性，导致实际勾选 - 正确做法是显式判断：
{{ $user->newsletter ? 'checked' : '' }}（PHP），或 EJS 中<%= user.newsletter ? 'checked' : '' %>
select multiple 怎么默认选中多个 option？
在需要默认选中的 <option> 标签上加 selected 属性，且 <select> 必须带 multiple 属性，否则只当单选处理。
注意：selected 只对 <option> 有效，对 <input type="checkbox"> 无效——这是新手最常混淆的点。
立即学习“前端免费学习笔记（深入）”；
-
selected也是布尔属性，简写即可：<option value="dev" selected>开发</option> - 可以同时给多个
<option>加selected，浏览器会全部高亮并提交对应值 - 如果
<select multiple>没设size，默认只显示一行，但多选功能不受影响；用户需按 Ctrl/Command 才能多选 - 后端接收时，注意字段名是否带
[]（如name="skills[]"），否则 PHP 等可能只收最后一个值
React/Vue 里为什么 default checked 不生效？
框架接管表单后，原生 checked 或 selected 属性只起初始渲染作用，后续状态完全由框架控制。硬写属性反而容易冲突。
- React 中：用
checked={flag}+onChange控制 checkbox；defaultChecked仅用于初始值，且不能响应后续 props 更新 - Vue 中：用
v-model绑定数组（多选 checkbox）或字符串（select multiple），checked属性会被忽略 - 动态加载选项时（比如异步 fetch），不要先渲染空
<select multiple>再塞<option>—— React 会因找不到匹配value而清空选中态 - 安全做法：用条件渲染，比如
{options.length > 0 && <select multiple value={selectedValues}>...</select>}
为什么 JS 设置 select.value 后界面没变化？
最常见的原因是 DOM 还没挂载，或者 value 值不严格匹配 <option value="..."> 的字符串内容（包括空格、大小写、引号包裹等）。
- 确保脚本执行时
<select>已存在于页面中，推荐放在</body>前，或用DOMContentLoaded包裹 -
select.value = "us"会自动滚动到匹配项并高亮，但如果没找到完全一致的value，它会设为空字符串，界面无反馈 -
select.selectedIndex = 1更暴力，直接按索引选，但选项顺序一变就失效 - 想触发绑定的
change监听器（比如校验逻辑），得手动派发事件：select.dispatchEvent(new Event('change', { bubbles: true }))
