jQuery选择器



在Dom 编程中我们只能使用有限的函数根据id 或者TagName 获取Dom 对象. 然而在jQuery 中则完全不同,jQuery 提供了异常强大的选择器用来帮助我们获取页面上的对象, 并且将对象以jQuery 包装集的形式返回。本章主要对常用的jQuery 选择器进行一个介绍及归类。

jQuery 选择器大体上可分为 4 类：基本选择器、层次选择器、过滤选择器、表单选择器。其中过滤选择器可以分为：简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器。具体示例图可见如下：

选择器

｜－基本选择器

｜－层次选择器

｜－表单选择器

｜－过滤选择器

          ｜—简单过滤选择器

          ｜－可见性过滤选择器

基本选择器

它是 jQuery 中使用最频繁的选择器，它由元素 Id 、 Class 、元素名、多个选择符组成，通过基本选择器可以实现大多数页面元素的查找。

选择器	功能	返回值
#id	根据给定的 ID 匹配一个元素	单个元素
element	根据给定的元素名匹配所有元素	元素集合
.class	根据给定的类匹配元素	元素集合
*	匹配所有元素	元素集合
Selector1, selector N	将每一个选择器匹配到的元素合并后一起返回	元素集合

#id选择器

示例：

.class选择器

示例：

*所有

示例：

Selector1, selector N

示例：

层次选择器

 它是通过 DOM 元素间的层次关系获取元素，其主要的层次关系包括后代、父子、相邻、兄弟关系，通过某些关系可以方便快捷地定位元素。

选择器	功能	返回值
Ancestor  descendant	根据祖先元素匹配所有的后代元素	元素集合
Parent > child	根据父元素匹配所有的子元素	元素集合
Prev + next	匹配所有紧接在 prev 元素后的相邻元素	元素集合
Prev ~sibling	匹配 prev 元素之后的所有兄弟元素	元素集合

注： ancestor descent 与 parent > child 所选择的元素集合是不同的，前者的层次关系是祖先与后代，而后者是父子关系；另外， prev + next 可以使用 .next() 代替，而 prev ~siblings 可以使用 .nextAll() 代替。

Parent > child 选择器

Prev + next 选择器

Prev ~sibling 选择器

属性过滤选择器

根据元素的某个属性获取元素，如 ID 号或匹配属性值的内容，并以“ [ ”开始，以“ ] ”结束。

选择器	功能	返回值
[attribute]	获取包含给定属性的元素	元素集合
[attribute=value]	获取等于给定的属性是某个特定值的元素	元素集合
[attribute!=value]	获取不等于给定的属性是某个特定值的元素	元素集合
[attribute^=value]	获取给定的属性是以某些值开始的元素	元素集合
[attribute$=value]	获取给定的属性是以某些值结尾的元素	元素集合
[attribute*=value]	获取给定的属性是以包含某些值的元素	元素集合
[selector1] [selectorN]	获取满足多个条件的复合属性的元素	元素集合

简单过滤选择器

过滤选择器根据某类过滤规则进行元素的匹配，书写时都以冒号（：）开头；简单过滤选择器是某中使用最广泛的一种。

选择器	功能	返回值
:first 或 first()	获取第一个元素	单个集合
:last 或 last()	获取最后一个元素	单个集合
:not(selector)	获取除给定选择器外的所有元素	元素集合
:even	获取所有索引值为偶数的元素，索引号从 0 开始	元素集合
:odd	获取所有索引值为奇数的元素，索引号从 0 开始	单个集合
:eq(index)	获取指定索引值的元素，索引号从 0 开始	元素集合
:gt(index)	获取所有大于给定索引值的元素，索引从 0 开始	元素集合
:lt(index)	获取所有小于给定索引值的元素，索引从 0 开始	元素集合
:header	获取所有标题类型的元素，如 h1 、 h2……	元素集合
:animated	获取正在执行动画效果的元素	元素集合

last过滤器

not过滤器

even过滤器

odd过滤器

eq过滤器

本章总结

jQuery 中的基本选择器包括标签选择器、类选择器、id选择器、并集选择器和全局选择器使用jQuery 的层次选择器可通过DOM 元素之间的层次关系来获取元素，包括后代元素
子元素、相邻元素和同辈元素。
使用属性选择器可通过HTML 元素的属性来选择元素。
使用过滤选择器可通过特定的过滤规则来筛选出所需的DOM元素，包括基本过滤选择卷、可见性过滤选择器等。
角写选择器时要注意特殊符号和空格。