全选反选小案例

原理：

当点击全选按钮时，其对应的元素将被去全部选中；当点击反选按钮时，会选中没有选中的元素，之前选中的元素将失去选中；当点击全不选按钮时，其对应的元素都将失去选中状态

核心：

主要就是改变input标签的checked属性

具体代码如下：

	<input type="button" id="All" value="全选" />
    <input type="button" id="uncheck" value="不选" />
    <input type="button" id="othercheck" value="反选" />
    <div id="div">
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
        <input type="checkbox" />电视<br/>
    </div>

<script>
window.onload = function(){
	//选中元素
	 var checkAll = document.getElementById('All');
     var uncheck = document.getElementById('uncheck');
     var othercheck = document.getElementById('othercheck');
     var div = document.getElementById('div');
     var checkbox = document.getElementsByTagName('input');

	//全选
	checkAll.onclick = function(){
		for(var i = 0; i < checkbox.length; i++){
			checkbox[i].checked = true;
		}
	}

	//全不选
	uncheck .onclick = function(){
		for(var i = 0; i < checkbox.length; i++){
			checkbox[i].checked = false;
		}
	}

	//反选
	othercheck.onclick = function(){
		for(var i = 0; i < checkbox.length; i++){
			if(checkbox[i].checked = false){
				checkbox[i].checked = true;
			}
			else{
				checkbox[i].checked = false;
			}
		}
}
<script>

最后，效果图如下：