二、jQuery常规选择器

jQuery选择器可以对 DOM 元素的标签名、属性名、状态等进行快速准确的选择，并且不必担心浏览器的兼容性。

一、简单选择器

ID元素返回的是单个元素，class和元素名返回的是多个元素，可以采用jquery核心自带的size()和length方法来查看返回的个数。

二、进阶选择器

三、高级选择器

//后代选择器

$(".box p").css("color","red");

jquery为后代选择器提供了提供了一个等价的find()方法

$(".box").find("p").css("color","red");

//子选择器

$(".box>p").css("color","red");

jquery为子选择器提供了提供了一个等价的children()方法

$(".box").children("p").css("color","red");

//next选择器（同级下一个节点）

$(".box+p").css("color","red");

jquery为next选择器提供了提供了一个等价的next()方法

$(".box").next("p").css("color","red");

//nextAll选择器（后面所有的同级节点）

$(".box~p").css("color","red");

jquery为nextAll选择器提供了提供了一个等价的nextAll()方法

$(".box").nextAll("p").css("color","red");

//prev()和prevAll()方法

$(".box").prev("p").css("color","red");  //同级上一个节点

$(".box").prevAll("p").css("color","red");  //同级上面所有的节点

//prevUntil()和nextUntil()方法

$(".box").prevUntil("p").css("color","red");    //同级上非指定元素选定，遇到则停止

$(".box").nextUntil("p").css("color","red");    //同级下非指定元素选定，遇到则停止

//siblings()方法

$(".box").siblings("p").css("color","red");   //选中上下相邻的所有元素

//等价于下面：

$('#box').prevAll('p').css('color', 'red'); //同级上所有元素选定

$('#box').nextAll('p').css('color', 'red'); //同级下所有元素选定

四、属性选择器