摘要:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
<style>
label{width:20px;height:40px;text-align: left;line-height: 40px;}
</style>
</head>
<body>
<div style= "width:120px;height:250px;border:1px solid gray;border-radius:5px;">
<div class="box" style="border-bottom:1px solid grey;">
<input type="checkbox" name="ck" onclick="checkall()">
<label for="ck">全選</label>
</div>
<input type="checkbox" name="ck"><label for="ck1">html</label><br>
<input type="checkbox" name="ck"><label for="ck1">css</label><br>
<input type="checkbox" name="ck"><label for="ck1">javascript</label><br>
<input type="checkbox" name="ck"><label for="ck1">jquety</label><br>
<input type="checkbox" name="ck"><label for="ck1">php</label>
</div>
<script>
function checkall(){
var check0=document.getElementsByName('ck')
//var check0=document.querySelectorAll('input')
for (var i=1;i<check0.length;i++){
if (check0[0].checked){
check0[i].checked=true;
}else{
check0[i].checked=false;
}
}
}
</script>
</body>
</html>
批改老師:韋小寶批改時(shí)間:2019-01-30 09:23:53
老師總結(jié):寫的很不錯(cuò) JavaScript中的全選操作不僅僅練習(xí)了我們的語(yǔ)法結(jié)構(gòu) 還練習(xí)了我們對(duì)數(shù)組的認(rèn)識(shí)