摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8">
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>复选框全选</title>
<style>
.box1 {
width: 100px;
height: 230px;
border: 1px solid lightblue;
border-radius: 8px;
margin: 100px auto;
}
.box1 .box2 {
height: 40px;
line-height: 40px;
border-bottom: 1px solid #ccc;
margin-bottom: 8px;
}
.box1 input {
margin: 8px 8px;
}
</style>
<script>
function checkall() {
var checkall, item;
checkall = document.getElementById('checkall');
item = document.getElementsByName('item[]');
// for (var i=0;i<item.length;i++){
// if(checkall.checked){
// item[i].checked = true;
// }else{
// item[i].checked = false;
// }
// }
var i = 0;
// while(i<item.length){
// if(checkall.checked){
// item[i].checked = true;
// }else{
// item[i].checked = false;
// }
// i++;
// }
do {
if (checkall.checked) {
item[i].checked = true;
} else {
item[i].checked = false;
}
i++;
} while (i < item.length)
}
</script>
</head>
<body>
<div>
<div>
<input type="checkbox" id="checkall" onclick="checkall()">
<label for="checkall">全选</label>
</div>
<input type="checkbox" name="item[]">选项1
<br>
<input type="checkbox" name="item[]">选项2
<br>
<input type="checkbox" name="item[]">选项3
<br>
<input type="checkbox" name="item[]">选项4
<br>
<input type="checkbox" name="item[]">选项5
<br>
<input type="checkbox" name="item[]">选项6
<br>
</div>
</body>
</html>在老师的运用for循环实现全选基础上使用了while循环和do while循环实现全选。
批改老师：韦小宝批改时间：2019-02-01 09:26:28
老师总结：写的很不错 for循环和while以及do while差别都不是很大 基本上都是可以进行替换的
