簡單的單選和全選功能實現

全選
    <input type="checkbox" id="quanxuan" >
    <br>
    單選
    <input type="checkbox" class="item">
    <br>
    單選
    <input type="checkbox" class="item">
    <br>
    單選
    <input type="checkbox" class="item">
    <br>
    單選
    <input type="checkbox" class="item">
    <br>
    單選
    <input type="checkbox" class="item">

 // 獲得全選按鈕的節點和所有單選的節點

    

    var quanbu = document.getElementById('quanxuan')
    var danxuan = document.getElementsByClassName('item')

  // 全選點擊的時候讓單選按鈕也和全選一種狀態

quanbu.onchange=function(){
            for(var i = 0;i<danxuan.length;i++){
                danxuan[i].checked = this.checked
           }
       }

// 循環所有單選按鈕並加事件

for(var i = 0;i<danxuan.length;i++){
            danxuan[i].onchange=function(){
                panduandanxuan()
            }
        }

// 單選按鈕事件
        var panduandanxuan = function(){
            // 定義一個計數器
            var count = 0
            // 每有一個單選為true就加一
            for(var a = 0;a<danxuan.length;a++){
                if(danxuan[a].checked == true){
                    count++
                }
                // 當計數器等於所有單選按鈕的length時全選選中
                if(count == danxuan.length){
                    quanbu.checked = true
                    // 否則不選中
                }else{
                    quanbu.checked = false
                }
            }
        }