这个我们应该都很熟悉,今天我们来实现一下功能
<script type="text/javascript">
//全选
function checkAll(){
var hobbies = document.getElementsByName("hobby");
for (var i = 0;i < hobbies.length;i++){
hobbies[i].checked = true;
}
}
//全不选
function checkNo(){
var hobbies = document.getElementsByName("hobby");
for (var i = 0;i < hobbies.length;i++){
hobbies[i].checked = false;
}
}
//反选
function checkReverse(){
var hobbies = document.getElementsByName("hobby");
for (var i = 0;i < hobbies.length;i++){
hobbies[i].checked = !hobbies[i].checked;
// if (hobbies[i].checked){
// hobbies[i].checked = false;
// }else {
// hobbies[i].checked = true;
// }
}
}
</script>
</head>
<body>
兴趣爱好
<input type="checkbox" name="hobby" value="c">c语言
<input type="checkbox" name="hobby" value="java">java
<input type="checkbox" name="hobby" value="php">php
<br>
<button onclick="checkAll()">全选</button>
<button onclick="checkNo()">全不选</button>
<button onclick="checkReverse()">反选</button>
</body>getElementByName 是根据指定的name属性查询返回多个标签对象集合,这个集合操作和数组一样
集合中每个元素都是dom对象
经验证,这个集合中的元素顺序是他们在html页面自上而下的顺序
checked表示复选框的选中状态,选中的true,不选中的false
checked属性可读可写
46
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
