<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> </head> <body> <input type="checkbox" name="" id="" class="check">全选/取消全选 <br> <input type="checkbox" name="nan" id="" class="ball_checkbox">足球<br> <input type="checkbox" name="nan" id="" class="ball_checkbox">棒球<br> <input type="checkbox" name="nan" id="" class="ball_checkbox">篮球<br> <input type="checkbox" name="nan" id="" class="ball_checkbox">橄榄球<br> <script type="text/javascript"> let delete_checkbox = document.getElementsByClassName('check')[0]; let arr = true; delete_checkbox.addEventListener('click', function() { let nan = document.getElementsByName('nan'); for (let i = 0; i < nan.length; i++) { nan[i].checked = this.checked; } }) </script> </body> </html>