jquery是很实用和方便的前端效果库，可以让我减少很多的操作和节省很多的时间。今天，我们来说一下jq的全选、全不选和反选效果，本篇讲的是最简单简洁的jq全选、全不选和反选的例子。如果还有什么其他的功能要求可自己根据所学到的基础来扩展一下。
首先，我们来创建一下所需要的html页面，导入jq文件，这里我们使用的是jq压缩版，把复选框例子填充上。
创建html页面的同时，把全选、全不选和反选按钮分别给它们id命名：all、not、reverse，方便jq之后获取CheckBox来实现全选不选等效果。
接下来，就是我们的jq登场了，jq根据按钮的ID名来获取点击事件，来实现我们所需要的效果。
其中，prop（），我们来说一下它的含义。
prop() 方法设置或返回被选元素的属性和值。
当该方法用于返回属性值时，则返回第一个匹配元素的值。
当该方法用于设置属性值时，则为匹配元素集合设置一个或多个属性/值对。
注意：prop() 方法应该用于检索属性值，例如 DOM 属性（如 selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 和 defaultSelected）。
这就是最简单的全选、全不选和反选的实例，希望对你们有所帮助。下面附上代码，供你们参考:
html代码：
<div id="box-function"><input id="all" type="button" value="全选" /><input id="not" type="button" value="全不选" /><input id="reverse" type="button" value="反选" /></div><div id="choose"><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /><input type="checkbox" />
</div>jq代码：
<script type="text/javascript">$(function(){var $choose = $("#choose input");//全选$("#all").click(function(){$choose.each(function(){$(this).prop("checked",true);});});//全不选$("#not").click(function(){$choose.prop("checked",false);});//反选$("#reverse").click(function(){$choose.each(function(){$(this).prop("checked",!$(this).prop("checked"));});});});</script>原文：
jq简单的全选、反选和全不选效果-三人行慕课www.3mooc.com
