全选全不选
界面：
代码：
<!DOCTYPE html><html><head> ???<meta charset="UTF-8"> ???<script type="text/javascript" src="jquery-3.3.1.js"></script></head><body> ???<input type="checkbox" id="checkall" />全选/全不选 ???<br/> ???<input type="checkbox" name="items" value="足球"/>足球 ???<input type="checkbox" name="items" value="篮球" />篮球 ???<input type="checkbox" name="items" value="游泳" />游泳 ???<input type="checkbox" name="items" value="唱歌" />唱歌 ???<input type="checkbox" name="items" value="读书" />读书 ???<br/> ???<input type="button" id="checkall_1" value="全选"/> ???<input type="button" id="checkno" value="全不选"/> ???<input type="button" id="checkarev" value="反选"/> ???<input type="button" id="send" value="提交"/> ???<script type="text/javascript"> ???//全选全不选 ???$(document).ready(function(){ ???????$("#checkall").click(function(){ ???????????if (($("#checkall").prop("checked"))){ ???????????$(":input[name=‘items‘]").attr("checked",true); ???????????}else{ ???????????$(":input[name=‘items‘]").attr("checked",false); ???????????} ???????}); ???}); ???//全选 ???$(document).ready(function(){ ???????$("#checkall_1").click(function(){ ???????????????????????$(":input[name=‘items‘]").attr("checked",true); ???????}); ???}); ???????//全不选 ???$(document).ready(function(){ ???????$("#checkno").click(function(){ ???????????//方式一 ???????????????????$(":input[name=‘items‘]").attr("checked",false); ???????//方式二 ???????????// $("input[name=‘checkbox‘]").removeAttr("checked"); ????????}); ???}); ???//反选 ???$(document).ready(function(){ ???????$("#checkarev").click(function(){ ???????$("input[name=‘items‘]").each(function(){ ???????????//attr ???????//1.attr("checked"):返回被选中元素的属性值 ???????????//2.attr("checked",true)：设置选中属性 ???????????????if (this.checked) { ???????????????$(this).prop("checked",false); ???????????}else{ ???????????????$(this).prop("checked",true); ???????????} ???????????}); ???????}); ???}); ???</script></body></html>【七】jquery之属性attr、 removeAttr、prop
原文地址：https://www.cnblogs.com/8013-cmf/p/8434712.html