从今天开始，就开始写文章了，记录一下自己的学习过程。每天记录一个小的技巧，加深学习印象。
今天写一个全选反选的小js效果，希望能对初学的朋友有所帮助，我的也是初学，有不对的地方望留言指教！
Document
首先，我们在页面写出我们需要的div结构，很简单，首先就是两个checkbox，一个全选，一个反选;
用来做选择；
然后建立一个div，给加个盒子，并命名id，利用它来找我们要操作的checkbox；
这样，我们的demo就建好了；
<input type="checkbox" id='checkAll' name="qx"/><label for=" checkAll ">全选</label>
<input type="checkbox" id=' checkInvert' name="checkInvert" /><label for=" checkInvert">反选</label>
<div class="checkbox" id="checkboxContainer"><br><br>
<input type="checkbox"/><br>
<input type="checkbox"/><br>
<input type="checkbox"/><br>
<input type="checkbox"/><br>
</div>
下面我们来写js代码，代码也很简单；
<script>
var checkAll = document.getElementById('checkAll');//找到这个全选按钮
var checkInvert = document.getElementById('checkInvert');//找到这个反选按钮
var checkbox = document.getElementById('checkboxContainer').getElementsByTagName('input');//找到所有的盒子里面的checkbox
首先，我们先建立script标签；然后呢，我们找到全选、反选按钮，和我们的checkbox；就像你要找一个女孩儿，先要告诉人家名字嘛！
然后呢。下面我们就要对他们进行嘿嘿嘿了。
//全选事件
checkAll.onclick = function(){
//我们先给按钮一个点击事件，然后建立一个for循环，找到所有的盒子下的input，在循环内部，我们就可以让盒子内部的checkbox的选中值等于我们全选按钮的选种值；
//这样，我们就完成了全选。
for(var i=0;i<checkbox.length;i++){
checkbox[i].checked = qx.checked;
checkInvert.checked = false;//还没完，这句话是什么意思呢?
//这是为了防止你点击了全选按钮，又去点击反选的时候，发现，全选按钮还在点击状态不信你去掉点击试试看
}
}
//同理，我们来完成反选；反选就是给我们的盒子下面的所有checkbox一个相反的chebox选中的值就可以了。
//注意，这里不是反选按钮相反的值，而是同样的所有checkbox的相反的值
checkInvert.onclick = function(){
for(var i=0;i<checkbox.length;i++){
checkbox[i].checked = !checkbox[i].checked;
checkAll.checked =false;//这里和全选一样，是为了点击反选按钮而出现的全选按钮选中的小bug；
}
}
</script>
到此，我们就完成了一个简单的全选反选的小js效果，是不是很简单呢；哈哈；期待我的文章能对你有所帮助；让我们共同进步！！！
