jQuery 选择器

jQuery选择器

1. 什么是jQuery选择器

1、jQuery 选择器允许您对 HTML 元素组或单个元素进行操作。

2、jQuery选择器是jQuery为我们提供的一组方法，让我们更加方便的获取到页面中的元素。注意：jQuery选择器返回的是jQuery对象。

3、jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"（或选择）HTML 元素。 它基于已经存在的 CSS 选择器，除此之外，它还有一些自定义的选择器。

4、jQuery 中所有选择器都以美元符号开头：$()。

2、jQuery的选择器有：

（1）基本选择器 （2）层级选择器 （3） 过滤选择器 （4）筛选选择器

3、基本选择器

（1） ID选择器    $(“#id”);   获取指定ID的元素

（2） 类选择器  $(“.class”);  获取同一类class的元素

（3）标签选择器  $(“div”);    获取同一类标签的所有元素

（4）并集选择器  $(“div,p,li”);  使用逗号分隔，只要符合条件之一就可。获取所有的div、p、li元素

（5） 交集选择器（标签指定式选择器） $(“div.redClass”)注意选择器1和选择器2之间没有空格，class为redClass的div元素，注意区分后代选择器。

总结:和css选择器的用法一模一样

4、层级选择器

（1）子代选择器   $(“ul>li”);使用>号，获取儿子层级的元素，注意，并不会获取孙子层级的元素

（2）后代选择器  $(“ul li”); 使用空格，代表后代选择器，获取ul下的所有li元素，包括孙子等

总结：跟CSS的选择器一模一样。
5、过滤选择器

(1):eq（index) $(“li:eq(2)”).css(“color”, ”red”);   获取到的li元素中，选择索引号为2的元素，索引号index从0开始。

（2) :odd  $(“li:odd”).css(“color”,  ”red”);  获取到的li元素中，选择索引号为奇数的元素

（3）  :even  $(“li:even”).css(“color”,  ”red”); 获取到的li元素中，选择索引号为偶数的元素

总结：这类选择器都带冒号。

6、筛选选择器

（1）children(selector)  $(“ul”).children(相当于”$(““li)择器ul>li”)，子类选择器

（2）find(selector)  $(“ul”).find(“li”); 相当于$(“ulli”), 后代选择器

（3）siblings(selector)  $(“#first”).siblings(“li”);查找兄弟节点，不包括自己本身。

（4）parent()     $(“#first”).parent();查找父亲

（5）eq(index)  $(“li”).eq(2);相当于$(“li:eq(2)”),index 从0开始

（6）next()   $(“li”).next()找下一个兄弟

（7）prev()   $(“li”).prev()找上一次兄弟

（8）Index()获取当前的位置（索引）  $(“li”).index()

总结：筛选选择器的功能与过滤选择器有点类似，但是用法不一样，筛选选择器主要
是方法。