一．简单选择器
在使用jQuery 选择器时，必须使用“$()”函数来包装CSS 规则。而CSS 规则作为参数传递到jQuery 对象内部后，再返回包含页面中对应元素的jQuery 对象。随后，就可以对这个获取到的DOM 节点进行行为操作了。
#box {//使用ID 选择器的CSS 规则 color:red;//将ID 为box 的元素字体颜色变红 }
在jQuery 选择器里，我们使用如下的方式获取同样的结果：
$('#box').css('color', 'red');//获取DOM 节点对象，并添加行为
那么除了ID 选择器之外，还有两种基本的选择器，分别为：元素标签名和类(class)：
选择器
CSS 模式
jQuery 模式
描述
元素名
div {}
$('div')
获取所有div 元素的DOM 对象
ID
#box {}
$('#box')
获取一个ID 为box 元素的DOM 对象
类(class)
.box{}
$('.box')
获取所有class 为box 的所有DOM 对象
$('#box').css('color', 'red');//获取DOM 节点对象，并添加行为 $('div').css('color', 'red');//元素选择器，返回多个元素 $('#box').css('color', 'red'); //ID 选择器，返回单个元素 $('.box').css('color', 'red'); //类(class)选择器，返回多个元素
为了证明ID 返回的是单个元素，而元素标签名和类(class)返回的是多个，可以采用jQuery 核心自带的一个属性length 或size()方法来查看返回的元素个数。
alert($('div').size());//3 个 alert($('#box').size()); //1 个，后面两个失明了 alert($('.box').size());//3 个
同理，也可以直接使用jQuery 核心属性来操作：
alert($('#box').length);//1 个，后面失明了
警告：有个问题特别要注意，ID 在页面只允许出现一次，一般都是要求开发者要遵守和保持这个规则。但如果你在页面中出现三次，并且在CSS 使用样式，那么这三个元素还会执行效果。但如果，你想在jQuery 这么去做，那么就会遇到失明的问题。所以，开发者必须养成良好的遵守习惯，在一个页面仅使用一个ID。
$('#box').css('color', 'red');//只有第一个ID 变红，后面两个失明
jQuery 选择器的写法与CSS 选择器十分类似，只不过功能不同。CSS 找到元素后添加的是单一的样式，而jQuery 则添加的是动作行为。最重要的一点是：CSS 在添加样式的时候，高级选择器会对部分浏览器不兼容，而jQuery 选择器在添加CSS 样式的时候却不必为此烦恼。
#box > p { //CSS 子选择器，IE6 不支持 color:red; } $('#box > p').css('color','red'); //jQuery 子选择器，兼容了IE6
jQuery 选择器支持CSS1、CSS2 的全部规则，支持CSS3 部分实用的规则，同时它还有少量独有的规则。所以，对于已经掌握CSS 的开发人员，学习jQuery 选择器几乎是零成本。而jQuery 选择器在获取节点对象的时候不但简单，还内置了容错功能，这样避免像JavaScript那样每次对节点的获取需要进行有效判断。
$('#pox').css('color', 'red');//不存在ID 为pox 的元素，也不报错 document.getElementById('pox').style.color = 'red';//报错了
因为jQuery 内部进行了判断，而原生的DOM 节点获取方法并没有进行判断，所以导致了一个错误，原生方法可以这么判断解决这个问题：
if (document.getElementById('pox')) {//先判断是否存在这个对象 document.getElementById('pox').style.color = 'red'; }
那么对于缺失不存在的元素，使用jQuery 调用的话，怎么去判断是否存在呢？因为本身返回的是jQuery 对象，可能会导致不存在元素存在与否，都会返回true。
if ($('#pox').length > 0) {//判断元素包含数量即可 $('#pox').css('color', 'red'); }
除了这种方式之外，还可以用转换为DOM 对象的方式来判断，例如：
if ($('#pox').get(0)) {} 或if ($('#pox')[0]) {} //通过数组下标也可以获取DOM 对象
二．进阶选择器
在简单选择器中，了解了最基本的三种选择器：元素标签名、ID 和类(class)。那么在基础选择器外，还有一些进阶和高级的选择器方便我们更精准的选择元素。
选择器
CSS 模式
jQuery 模式
描述
群组选择器
span,em,.box {}
$('span,em,.box')
获取多个选择器的DOM 对象
后代选择器
ul li a {}
$('ul li a')
获取追溯到的多个DOM 对象
通配选择器
* {}
$('*')
获取所有元素标签的DOM 对象