全选或全不选
作者：互联网
全选或全不选：
步骤分析：
1.确定事件：最上面那个复选框的单击事件 onclick
2.编写函数：让所有的复选框和最上面的复选框保持一致
a.获取最上面这个复选框选中状态 通过checkbox的checked属性即可
b.获取其他的复选框，设置他们的checked属性即可
可以通过
document.getElementsByClassName() 需要给下面所有的checkbox添加class属性
document.getElementsByName() 需要给下面所有的checkbox添加name属性
3.效果图：
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script>
function selectAll(obj){
//获取当前复选框状态
if(obj.checked==true){
//获取所有复选框
var arr = document.getElementsByClassName("itemSelect");
for(var i = 0;i<arr.length;i++){
//设置所有复选框状态
arr[i].checked = true;
}
}else{
var arr = document.getElementsByClassName("itemSelect");
for(var i = 0;i<arr.length;i++){
arr[i].checked = false;
}
}
}
</script>
<body>
<table id="tab1" border="1" width="800" align="center" >
<tr>
<th><input type="checkbox" onclick="selectAll(this)" ></th>
<th>分类ID</th>
<th>分类名称</th>
<th>分类描述</th>
<th>操作</th>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>1</td>
<td>手机数码</td>
<td>手机数码类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>2</td>
<td>电脑办公</td>
<td>电脑办公类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>3</td>
<td>鞋靴箱包</td>
<td>鞋靴箱包类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
<tr>
<td><input type="checkbox" class="itemSelect"></td>
<td>4</td>
<td>家居饰品</td>
<td>家居饰品类商品</td>
<td><a href="">修改</a>|<a href="">删除</a></td>
</tr>
</table>
</body>
</html>
标签：checkbox,checked,删除,复选框,全选,全不选,document,属性 来源： https://www.cnblogs.com/yisennnn/p/13263561.html