多选框默认勾选需在标签添加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 中
select multiple 怎么默认选中多个 option？
在需要默认选中的 <option></option> 标签上加 selected 属性，且 <select></select> 必须带 multiple 属性，否则只当单选处理。
注意：selected 只对 <option></option> 有效，对 <input type="checkbox"> 无效——这是新手最常混淆的点。
-
selected也是布尔属性，简写即可：<option value="dev" selected>开发</option> - 可以同时给多个
<option></option>加selected，浏览器会全部高亮并提交对应值 - 如果
<select multiple></select>没设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></select>再塞<option></option>—— React 会因找不到匹配value而清空选中态 - 安全做法：用条件渲染，比如
{options.length > 0 && <select multiple value="{selectedValues}">...</select>}
为什么 JS 设置 select.value 后界面没变化？
最常见的原因是 DOM 还没挂载，或者 value 值不严格匹配 <option value="..."></option> 的字符串内容（包括空格、大小写、引号包裹等）。
- 确保脚本执行时
<select></select>已存在于页面中，推荐放在
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
