单选按钮必须用且同组name值完全相同才能互斥；name区分大小写，需统一小写加下划线或短横线；value决定提交值，不可为空或中文；label必须绑定提升点击体验；默认选中仅用checked属性且同一组唯一。
单选按钮必须用 <input type="radio">，且同一组选项的 name 属性值要完全相同，否则无法互斥选择。
radio 必须配 name 才能成组
浏览器只靠 name 判断哪些 radio 属于同一组。没有 name，或 name 值不一致，它们就是独立控件，可以全选、不选、随便选。
-
name值区分大小写，gender和Gender是两组 - 推荐用小写字母 + 下划线或短横线，比如
user_role、theme-mode - 不要用空格或中文，
name="用户类型"会触发解析异常
value 值决定提交时发送什么
用户点选后，表单提交的不是显示文字，而是对应 value 的字符串。页面上看到的“男”“女”，和实际发给后端的值是两回事。
- 没写
value时，默认提交"on"（所有未设 value 的 radio 都一样，后端很难区分） -
value应该用语义清晰的英文或规范缩写，比如value="admin"、value="dark" - 避免用
value="是"这类中文，后端解析易出编码或空格问题
label 标签不能少，否则点击体验极差
直接点 <input> 小圆圈才能触发，但人更习惯点文字。用 <label></label> 包裹或绑定，就能点文字选中。
立即学习“前端免费学习笔记（深入）”；
- 推荐写法：
<label><input type="radio" name="mode" value="light"> 白天模式</label> - 或者用
for绑定：<input id="mode-dark" type="radio" name="mode" value="dark"><label for="mode-dark">黑夜模式</label> - 别只写
<input>+ 独立文字，移动端几乎点不中
默认选中用 checked，但别多个一起加
同一组 radio 中，最多只能有一个带 checked。如果写了多个，浏览器只认第一个，其余忽略 —— 但这容易让人误以为逻辑有问题。
- 想默认选中，只在其中一个加
checked，比如：<input type="radio" name="size" value="m" checked> - 动态设置默认值时，JavaScript 要清空其他同名 radio 的
checked属性，不能只设一个 - 服务端渲染时，
checked应由数据决定，别硬编码死
最容易被忽略的是 name 的一致性 —— 看似简单，但拼错一个字母、多一个空格、大小写混用，整组就失效。调试时先查元素面板里所有 radio 的 name 是否真的一模一样。
