点击按钮清空单选/多选框需用JavaScript遍历并设checked=false；若恢复初始状态，应预先用Map缓存各元素初始值；重置时须跳过disabled元素以保持语义一致。
点击按钮时清空所有 input[type="radio"] 和 input[type="checkbox"]
HTML 原生的 <input type="reset"> 只对表单内元素生效，且必须在 <form> 中才起作用。如果想用普通按钮（比如 <button>）手动重置单选/多选框，就得靠 JavaScript 主动清除 checked 属性。
最直接的做法是遍历目标区域内的所有相关元素，逐个设 checked = false：
document.querySelector('#resetBtn').addEventListener('click', () => {
document.querySelectorAll('input[type="radio"], input[type="checkbox"]').forEach(el => {
el.checked = false;
});
});
- 注意：仅设
checked = false即可，不用调用el.removeAttribute('checked')—— 后者在 DOM 中可能残留属性但不生效，反而容易混淆 - 如果只重置某组控件（比如某个 fieldset 内），把
document.querySelectorAll(...)改成限定范围，例如fieldset#myGroup.querySelectorAll(...) - 不要用
el.checked = ''或el.checked = null，这些值会被强制转为true或触发意外行为
重置时保留部分 checkbox 的初始状态
有些场景下，你希望“重置”不是清空全部，而是回到页面加载时的原始选中状态（比如某些 checkbox 默认勾选）。这时不能硬编码 false，得提前存下初始值。
推荐在页面加载后立即缓存初始状态：
立即学习“前端免费学习笔记（深入）”；
const initialStates = new Map();
document.querySelectorAll('input[type="checkbox"], input[type="radio"]').forEach(el => {
initialStates.set(el, el.checked);
});
document.querySelector('#resetBtn').addEventListener('click', () => {
initialStates.forEach((checked, el) => {
el.checked = checked;
});
});
-
Map比对象更安全，能正确处理 DOM 元素作为 key - radio 按 name 分组，同一组里只有一个是 true，这个逻辑由浏览器自动维护，不需要额外处理
- 如果页面动态插入了新控件，需要在插入后手动调用一次状态记录，否则它们不会被包含在
initialStates中
避免影响 disabled 的控件
重置操作不该改变已被禁用（disabled）的控件状态——用户无法操作它们，强行修改反而可能导致 UI 不一致。
- 加一个过滤条件：
el.disabled === false - 完整写法示例：
document.querySelectorAll('input[type="radio"], input[type="checkbox"]').forEach(el => { if (!el.disabled) el.checked = false; }); - 特别注意：disabled 元素的
checked属性仍可读写，但浏览器 UI 不会响应；重置时跳过它们，是尊重原始语义
兼容性与性能提醒
querySelectorAll 在 IE9+ 都支持，但 IE 低版本不支持箭头函数和 forEach 遍历 NodeList —— 如果还需兼容 IE8，得用传统 for 循环。
- NodeList 不是数组，IE8 下不能直接用
forEach，要写成：var inputs = document.querySelectorAll('...'); for (var i = 0; i < inputs.length; i++) { inputs[i].checked = false; } - 如果页面有成百上千个 checkbox/radio，批量赋值基本无性能压力；但若配合动画或频繁触发，建议加节流或用
requestIdleCallback延后执行 - 别忘了给按钮加
type="button"，否则在 form 里默认是submit，点一下可能意外提交表单
