How to implement “select all” check box in HTML?

Question

I have an HTML page with multiple checkboxes.

I need one more checkbox by the name \"select all\". When I select this checkbox all checkboxes in the HTML page must b

Answer 1

1: Add the onchange event Handler

2: Modify the code to handle checked/unchecked

 function checkAll(ele) {
     var checkboxes = document.getElementsByTagName('input');
     if (ele.checked) {
         for (var i = 0; i < checkboxes.length; i++) {
             if (checkboxes[i].type == 'checkbox') {
                 checkboxes[i].checked = true;
             }
         }
     } else {
         for (var i = 0; i < checkboxes.length; i++) {
             console.log(i)
             if (checkboxes[i].type == 'checkbox') {
                 checkboxes[i].checked = false;
             }
         }
     }
 }