<! DOCTYPE html>
<meta charset= "UTF-8" >
The <title> page has 10 multi-box, three buttons (Reset, reverse, select all) function </title>
<body>
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<input type= "checkbox" >
<button id= "reset" > Reset </button>
<button id= "Invert" > Anti-selection </button>
<button id= "All" > select all </button>
<script>
var Reset=document.getelementbyid (' Reset ');
var Invert=document.getelementbyid (' invert ');
var All=document.getelementbyid (' All ');
var checkbox=document.getelementsbytagname (' input ');
Reset.addeventlistener (' click ', function () {
for (Var i=0;i<checkbox.length;i++) {
Checkbox[i].checked=false;
}
});
Invert.addeventlistener (' click ', function () {
for (Var i=0;i<checkbox.length;i++) {
/*if (checkbox[i].checked==true) {
Checkbox[i].checked=false;
}else {
Checkbox[i].checked=true;
}*/
checkbox[i].checked =!checkbox[i].checked
}
});
All.addeventlistener (' click ', function () {
for (Var i=0;i<checkbox.length;i++) {
Checkbox[i].checked=true;
}
})
</script>
</body>
JS Small Exercise-page implementation of Reset, reverse, select all three buttons function