JavaScript是一种属于网络的脚本语言，已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。
javascript实现全选和全不选效果：
1、首先你需要了解input标签中复选框。当该复选框被选中时，调用该元素checked属性的值为true。这一点是我们利用js实现该效果的第一个要点。
2、全选：当鼠标点击全选这个复选框时，调用函数allSelet().使用for循环遍历每一个需要被选中的input元素（我们它们全部放在箱子里面），并给它们的checked属性赋值true。这样就完成了全选。
3、全不选：当鼠标点击全选这个复选框时，调用函数noSelet().使用for循环遍历每一个需要被选中的input元素（包括全选那个复选框，所以我们直接从document中获取input），并给它们的checked属性赋值false。这样就完成了全不选。
JavaScript实现全选与全不选代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Who is the best one?</title>
<style type="text/css">
*{
background: greenyellow;
}
</style>
</head>
<body>
<input type="checkbox" οnclick="allSelect()"/>全选
<input type="checkbox" οnclick="noSelect()"/>全不选
<div id="box">
<input type="checkbox" />选我
<input type="checkbox" />选我
<input type="checkbox" />选我
<input type="checkbox" />选我
<input type="checkbox" />选我
<input type="checkbox" />选我
</div>
<script type="text/javascript ">
function allSelect() {
var oBox = document.getElementById("box");
var aInput = oBox.getElementsByTagName("input");
for(var i = 0; i < aInput.length; i++) {
aInput[i].checked = true;
}
}
function noSelect() {
var oBox = document.getElementById("box");
var aInput = document.getElementsByTagName("input");
for(var i = 0; i < aInput.length; i++) {
aInput[i].checked = false;
}
}
</script>
</body>
</html> 
网友评论文明上网理性发言 已有0人参与
发表评论: