直接在目标标签上加selected属性是唯一可靠、语义正确且兼容所有浏览器的原生方式；它为布尔属性，写上即生效，不可用required或default替代，多选时需配合multiple属性，框架中须用状态控制而非selected。
直接在目标 <option></option> 标签上加 selected 属性，别的都别写——这是唯一可靠、语义正确、兼容所有浏览器的原生方式。
为什么不能用 default 或 required 代替 selected
required 只影响表单提交验证，和默认选中无关；default 根本不是 HTML 标准属性，浏览器会直接忽略它，写了等于白写。很多初学者抄错代码，把 required 当成默认值开关，结果页面加载后下拉框始终空白或停在第一个选项上，其实只是碰巧没报错而已。
-
selected是布尔属性，只存在即生效，写成selected="true"或selected="selected"属于冗余，易引发误解 - 多个
<option selected></option>并不会多选，浏览器只认第一个，但结构已不合法，可能被 Linter 报警或影响可访问性检测 - 若想设“请选择”为占位提示项，应写作
<option value="">-- 请选择 --</option>，且不加selected；真要默认选它，才加selected，但需配合后端/JS 判空逻辑
selected 在多选（multiple）场景下的行为差异
普通单选 <select></select> 中，多个 selected 仅首项生效；但在 <select multiple></select> 下，多个 <option selected></option> 可同时高亮，纯 HTML 即可实现预设多选状态。
- 必须确保父级
<select></select>确实带multiple属性，否则浏览器当单选处理，仍只认第一个selected - React/Vue 等框架中，
selected属性会被完全忽略——必须通过组件状态（如数组）控制value或v-model，否则渲染出来永远是空的 - 服务端动态生成 HTML 时，要严格比对后端传来的“预选值”与每个
<option value="..."></option>的字符串值：大小写、前后空格、JSON 字符串是否转义，差一点就匹配失败
JavaScript 动态设置时，select.value 和 select.selectedIndex 怎么选
两者都能改，但风险点完全不同：select.value = "us" 靠值匹配，安全但依赖精确字符串；select.selectedIndex = 1 靠位置，快但脆弱。
- 用
value：适合 value 值稳定、已知的场景；若匹配不到，select.value会变成空字符串，界面无变化，也不报错——容易误以为“设置了但没生效” - 用
selectedIndex：适合初始化时确定位置（比如“第二个选项总是默认”），但一旦插入/删除选项，索引就偏了，线上可能突然默认错项 - 无论哪种，都得确认
<select></select>已挂载到 DOM；脚本放在里、或在document.createElement后立刻操作，大概率失效 - 如果监听了
change事件（比如触发校验），赋值后需手动派发：select.dispatchEvent(new Event('change', { bubbles: true }))
最容易被忽略的是：框架中混用 HTML selected 和 JS 控制，或者异步加载 <option></option> 后忘记重置 value 状态——这时候看到的“没默认选中”，往往不是语法问题，而是执行时机或数据流断了。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
