abstract：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>全選案例</title> <style> *{margin: 0;padding: 0;} h2{margin:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>全選案例</title>
<style>
*{margin: 0;padding: 0;}
h2{margin: 0 auto;width: 600px;text-align: center}
#box{width: 100px;line-height: 30px;margin: 100px auto;border:1px solid black;text-align: center;}
.checkAll{background: black;color: white;line-height: 50px;}
</style>
</head>
<body>
<h2>全選案例</h2><hr>
<div id="box">
<div class="checkAll"><input type="checkbox" id="checkAll" onclick="checkAll()" ><label for="checkAll">全選</label></div>
<div class="item">
<input type="checkbox" name="item[]">桃子<br>
<input type="checkbox" name="item[]">栗子<br>
<input type="checkbox" name="item[]">草莓<br>
<input type="checkbox" name="item[]">香蕉<br>
</div>
</div>
</body>
<script>
function checkAll(){
var checkall, item;
checkall = document.getElementById("checkAll");
item = document.getElementsByName("item[]");
if(checkall.checked){
for(var i=0;i<item.length;i++){
item[i].checked=true;
}
}else{
for(var i=0;i<item.length;i++){
item[i].checked=false;
}
}
}
</script>
</html>思路：onclick調(diào)用checkAll方法
與vip視頻中的差別在于：先判斷再循環(huán)賦值，減少運(yùn)算次數(shù)
Correcting teacher：天蓬老師Correction time：2019-04-13 16:47:28
Teacher's summary：每個(gè)案例,都能總結(jié)思路的話, 你會(huì)進(jìn)步非?？斓? 我也是這樣學(xué)習(xí)的