js achieve Select / Select None Effects

js achieve Select / Select None Effects

code show as below:

<! DOCTYPE HTML > 
< HTML lang = "zh_CN" > 
< head > 
    < Meta charset = "UTF-. 8" > 
    < title > Select </ title > 
</ head > 
< body > 
<-! HTML Two word connection - partition -> 
< INPUT type = "CheckBox" ID = "Check-All" the onclick = "switchItem ();" > < br > 

<input type="checkbox" class="check-item"><br>
<input type="checkbox" class="check-item"><br>
<input type="checkbox" class="check-item"><br>
<input type="checkbox" class="check-item"><br>
<input type="checkbox" class="check-item"><br>
<input type="checkbox" class="check-item"><br>
< INPUT type = "CheckBox" class = "Check-Item" > < br > 

< Script > 
    // 1. find the state of the whole box 
    // 2. Other checkbox is set to full state box 
    function switchItem () {
         var checkAll = document.getElementById ( ' Check-All ' ); 

        var items = document.getElementsByClassName ( ' Check-Item ' );
     // since a plurality of check boxes, it is necessary to traverse, no index can be used forof loop 
        for ( var Item of items) { 
            item.checked= checkAll.checked ;
        }
    }

</script>
</body>
</html>