功能：点击上面input上面全选，点击下面按钮判断，如果全部选中那么上面就选中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.wrap{
text-align: center;
position: absolute;
top:200px;
left: 550px;
}
</style>
<script>
window.function () {
//点击上面input上面全选
var topipt=document.getElementById("headipt");
var tbody=document.getElementById("tbody");
var bomiptArr=tbody.getElementsByTagName("input");
topipt.function () {
if(topipt.checked===true){
for(var i=0;i<bomiptArr.length;i++){
bomiptArr[i].checked=true;
}
}else {
for(var i=0;i<bomiptArr.length;i++){
bomiptArr[i].checked=false;
}
}
/*优化版
for (var i=0;i<bomiptArr.length;i++){
bomiptArr[i].checked=this.checked;
}*/
}
//点击下面按钮判断
for(var i=0;i<bomiptArr.length;i++){
bomiptArr[i].function () {
var bool=true;
for(var j=0;j<bomiptArr.length;j++){
if(bomiptArr[j].checked===false){
bool=false;
}
}
topipt.checked=bool;
}
}
}
</script>
</head>
<body>
<div class="wrap">
<table border="1">
<thead id="thead">
<tr>
<th>
<input type="checkbox" id="headipt">
</th>
<th>西红柿炒鸡蛋</th>
<th>饭店</th>
</tr>
</thead>
<tbody id="tbody">
<tr>
<td>
<input type="checkbox">
</td>
<td>糖醋里脊</td>
<td>张三</td>
</tr>
<tr>
<td>
<input type="checkbox">
</td>
<td>甜不辣</td>
<td>李四</td>
</tr>
<tr>
<td>
<input type="checkbox">
</td>
<td>蔬菜大拼</td>
<td>王五</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>