全选全不选反选功能实现--- highlight: tomorrow-night --- ```html [ ]请选

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>反选</title>
	</head>
	<body>
		<input type="checkbox" name="c1" value="1"/>请选择<br/>
		<input type="checkbox" name="c1" value="2"/>请选择<br/>
		<input type="checkbox" name="c1" value="3"/>请选择<br/>
		<input type="checkbox" name="c1" value="4"/>请选择<br/>
		<input type="checkbox" name="c1" value="5"/>请选择<br/>
		<input type="checkbox" name="c1" value="6"/>请选择<br/>
		<input type="checkbox" name="c1" value="7"/>请选择<br/>
		<input type="checkbox" name="c1" value="8"/>请选择<br/>
		<input type="button" id="all" value="全选">
		<input type="button" id="unCheck" value="全不选">
		<input type="button" id="backCheck" value="反选">
	</body>
	<script type="text/javascript">
			//获取name为check的数组
			var checkArray = document.getElementsByName("c1");
			//点击全选按钮时的效果
			document.getElementById("all").onclick = function(){
				for(var i=0; i<checkArray.length; i++){
					checkArray[i].checked = true;
				}
			}
			//点击全不选按钮时的效果
			document.getElementById("unCheck").onclick = function(){
				for(var i=0; i<checkArray.length; i++){
					checkArray[i].checked = false;
				}
			}
			//点击反选按钮时的效果
			document.getElementById("backCheck").onclick = function(){
				for(var i=0; i<checkArray.length; i++){
					checkArray[i].checked = !checkArray[i].checked; 
				}
			}
	</script>
</html>

全选 全不选 反选功能实现

全选全不选反选功能实现