全选和反选复选框联动需三步实现：1. html中为全选框设id、子项统用class；2. 全选框change事件批量控制子项，反选按钮遍历取反；3. 子项change时统计勾选数，动态设全选框checked或indeterminate。
全选和反选的复选框联动，核心在于监听“全选框”的变化来控制所有子选项，同时根据子选项的状态动态更新“全选框”的勾选状态（比如全勾选时自动打钩，全部取消时自动取消）。下面分三步讲清楚实现逻辑和常见写法。
1. HTML 结构要清晰，便于 JS 定位
给全选框一个固定标识（如 id="checkAll"），所有子复选框统一用相同的 name 或加相同 class（推荐 class，更灵活）：
<input type="checkbox" id="checkAll"> 全选<br><input type="checkbox" class="item-check" value="1"> 选项1<br><input type="checkbox" class="item-check" value="2"> 选项2<br><input type="checkbox" class="item-check" value="3"> 选项3
2. 全选框控制所有子项（含“反选”功能）
给全选框绑定 change 事件，获取它的 checked 状态，批量赋值给所有子项：
- 如果全选框被勾选 → 所有
.item-check的checked = true - 如果全选框被取消 → 所有
.item-check的checked = false - 反选可单独加个按钮，点击时遍历所有子项，把每个的
checked取反：el.checked = !el.checked
3. 子项变化时同步更新全选框状态
给每个子复选框也绑定 change 事件，统计当前有多少个被勾选：
- 若勾选项数 === 总数 → 全选框
checked = true - 若勾选项数 === 0 → 全选框
checked = false - 否则（部分勾选）→ 全选框设为
indeterminate = true（视觉上显示短横线，表示“不完全一致”）
注意：indeterminate 是只读属性，设置它不会触发 change 事件，也不会影响 checked 值，纯属 UI 提示。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
