用JavaScript（js）实现复选框效果（全选、全不选、反选）！

话不多说，先上效果图：

HTML代码：

<p>请选择你的爱好</p>
<input type="checkbox" id="orallchoose">全选/全不选
<br>
<input type="checkbox"  class="hobby">打篮球
<input type="checkbox"  class="hobby">踢足球
<input type="checkbox"  class="hobby">敲代码
<input type="checkbox"  class="hobby">唱歌
<input type="checkbox"  class="hobby">跳舞
<br>
<input type="button" id="allchoose" value="全选">
<input type="button" id="nochoose" value="全不选">
<input type="button"  id="Fchoose" value="反选">

JavaScript代码：

let orallchoose = document.getElementById("orallchoose");
let allchoose = document.getElementById("allchoose");
let nochoose = document.getElementById("nochoose");
let hobby = document.getElementsByClassName("hobby");
let Fchoose = document.getElementById("Fchoose");
let check = true;   allchoose.onclick = function(check){ //全选按钮事件for(let i=0;i<hobby.length;i++){hobby[i].checked = check;   }
}
nochoose.onclick = function(){ //全不选按钮事件check = false;for(let i=0;i<hobby.length;i++){hobby[i].checked = check;}orallchoose.checked = check;check = true;
}
orallchoose.onclick = function(){ //全选或全不选按钮事件if(check){for(let i=0;i<hobby.length;i++){hobby[i].checked = check;}check=false;}else{for(let i=0;i<hobby.length;i++){hobby[i].checked = check;  } check=true;      }
}
Fchoose.onclick = function(){ //反选按钮事件for(let i=0;i<hobby.length;i++){hobby[i].checked = !hobby[i].checked;}
}