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()

 

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