原生js实现全选与反选

html结构

<form id="autoNews">
  <input type="checkbox" value="1" class="begoing">
  <input type="checkbox" value="2" class="begoing">
  <input type="checkbox" value="3" class="begoing">
</form>
<span class="selectAll" id="selectAll">全选/反选</span>

js

document.addEventListener('DOMContentLoaded', function() {    
    var selectAllButton = document.getElementById('selectAll');    
    var isSelectAllChecked = false;  
    if (selectAllButton) {    
        selectAllButton.addEventListener('click', function() {    
            var auto = document.getElementById('autoNews');    
            if (auto) {    
                var inputs = auto.getElementsByClassName('begoing');   
                for (var i = 0; i < inputs.length; i++) {    
                    if (inputs[i].type == 'checkbox') {    
                        inputs[i].checked = !isSelectAllChecked;  
                    }  
                }  
                // 切换状态  
                isSelectAllChecked = !isSelectAllChecked;  
            }  
        });    
    }    
});