jQuery学习笔记——各类选择器

$()工厂函数很强大，令其强大的是各种选择器。以下是个人对其中选择器的学习笔记。

 

1、标签选择器

如：$("tbody")   找寻所有表格中的tbody元素

 

2、id选择器

如：$("#div1") 找寻id为div1的元素

 

3、class选择器

如：$(".style1") 找寻class为style1的元素

 

4、层次选择器

此选择器通过dom元素之间的关系来确定所寻找的元素

如：$("div span") 找寻div元素中所有的span元素

      $("div > span") 找寻div元素的名为span的子元素（此和上一个例子区别在于一个所有，包括子元素，孙元素。后者只是子元素）。

      $("div + span")  找寻div元素后第一个span元素（等同于("div").next()）

      $("div ~ siblings") 找寻div元素后所有的span元素（等同于$("div").nextAll()）

 

5、过滤选择器

此选择器可以通过特定的规则，过滤出所需的元素

如：$("div : first") 找寻所有div元素中第一个div元素

      $("div : last") 找寻所有div元素中最后一个div元素

      $("div : not(.style1)") 找寻所有div元素中class不为style1的div元素

      $("div : even") 找寻div元素中所有偶数的div元素（索引从0开始）

      $("div : odd") 找寻div元素中所有奇数的div元素（索引从0开始）

      $("div : eq(1)") 找寻div元素中索引为1的div元素（索引从0开始）

      $("div : gt(1)") 找寻div元素中索引大于1的div元素（索引从0开始）

      $("div : lt(1)") 找寻div元素中索引小于1的div元素（索引从0开始）

      $("div : contain('我')") 找寻div元素中含有文本“我”的div元素

      $("div : empty") 找寻div元素中不包含任何子元素和文本的div元素

      $("div : has(span)") 找寻div元素中含有p元素的div元素

      $("div : parent") 找寻div元素中含有子元素或者文本的div元素

      $("div : hidden") 找寻div元素中所有隐藏的div元素

      $("div : visible") 找寻div元素中所有显示的div元素

      $("div : first-child") 找寻每个div元素中第一个子元素（first只返回一个，此处返回每一个父元素下匹配的子元素）

      $("div : last-child") 找寻每个div元素中最后一个子元素（区别同上）

      $("div : nth-child(1)") 找寻div元素中第一个的子元素（eq索引从0开始，这里索引从1开始）

 

6、属性选择器

如：$("div [id='div1']") 找寻id为div1的div元素

其中的=可以换成以下的符号

!=   id不为div1的div元素

^= id以div1开头的div元素

*= id中包含div1的div元素

$= id以div1结尾的div元素

 

以上是自己运用过的选择器，留下笔记以备复习