摘要:<!DOCTYPE html><html><head> <title>switch</title> <style type="text/css"> .box0{width: 100px;height: 200px;;margin:100px auto;border: 1px solid #000} .box
<!DOCTYPE html>
<html>
<head>
<title>switch</title>
<style type="text/css">
.box0{width: 100px;height: 200px;;margin:100px auto;border: 1px solid #000}
.box0 div{margin-bottom: 20px;border-bottom: 1px solid #000}
.box0 input{margin-top: 8px;}
</style>
</head>
<body>
<script type="text/javascript">
function function_checkAll() {
var checkall,item;
checkall=document.getElementById("in")
item=document.getElementsByName("in1")
console.log(item)
for(var i=0;i<item.length;i++){
console.log(item[i])
if (checkall.checked) {item[i].checked=true;}
else{item[i].checked=false;}
}
}
</script>
<div class="box0">
<div>
<input type="checkbox" id="in" onclick="function_checkAll()"><label for "in">全选</label>
</div>
<input type="checkbox" name="in2" id="in1"><label for "in1">选项1</label><br>
<input type="checkbox" name="in2" id="in1"><label for "in1">选项2</label><br>
<input type="checkbox" name="in2" id="in1"><label for "in1">选项3</label><br>
<input type="checkbox" name="in2" id="in1"><label for "in1">选项4</label><br>
<input type="checkbox" name="in2" id="in1"><label for "in1">选项5</label><br>
<input type="checkbox" name="in2" id="in1"><label for "in1">选项6</label><br>
</div>
</body>
</html>
批改老师:韦小宝批改时间:2019-02-11 10:05:58
老师总结:写的很不错 全选在很多的项目中都可以见到 并且还是比较重要的知识