jQuery1.2选择器(1)

最新推荐文章于 2025-04-09 21:33:59 发布

转载最新推荐文章于 2025-04-09 21:33:59 发布 · 131 阅读

CC 4.0 BY-SA版权

文章标签：

本文详细介绍了jQuery中的基本选择器和滤镜，包括ID选择器、元素选择器、类选择器等，以及:first、:last、:not等滤镜的使用方法，帮助读者深入理解并灵活运用jQuery选择器。

#myid	返回: <jQuery对象>
匹配一个id为myid的元素。
element	返回: <jQuery对象> 数组
匹配所有的element元素
.myclass	返回: <jQuery对象> 数组
匹配所有class为myclass的元素
*	返回: <jQuery对象> 数组
匹配所有元素。该选择器会选择文档中所有的元素，包括html，head，body
selector1,selector2,selectorN	返回: <jQuery对象> 数组
匹配所有满足selector1或selector2或selectorN的元素

elementParent elementChild	返回: <jQuery对象> 数组
匹配elementParent下的所有子元素elementChild。例如：$("div p") 选择所有div下的p元素
elementParent > elementChild	返回: <jQuery对象> 数组
匹配elementParent下的子元素elementChild。例如：$("div>p") 选择所有上级元素为div的p元素
prev+next	返回: <jQuery对象> 数组
匹配prev同级之后紧邻的元素next。例如：$("h1+div") 选择所有div同级之前为h1的元素（<h1 /><div />）
prev ~ siblings	返回: <jQuery对象> 数组
匹配prev同级之后的元素siblings。例如：$("h1~div") 可以匹配（<h1 /><div /><div />）

:first	返回: <jQuery对象>
匹配第一个元素
:last	返回: <jQuery对象>
匹配最后一个元素
:not(selector)	返回: <jQuery对象> 数组
匹配不满足selector的元素
:has(selector)	返回: <jQuery对象> 数组
匹配包含满足selector的元素。此选择器为1.2新增
:even	返回: <jQuery对象> 数组
从匹配的元素集中取序数为偶数的元素。
:odd	返回: <jQuery对象> 数组
从匹配的元素集中取序数为奇数的元素。
:eq(index)	返回: <jQuery对象> 数组
从匹配的元素集中取第index个元素
:gt(index)	返回: <jQuery对象> 数组
从匹配的元素中取序数大于index的元素
:lt(index)	返回: <jQuery对象> 数组
从匹配的元素中取序数小于index的元素
:header	返回: <jQuery对象> 数组
匹配所有的标题元素，例如h1，h2，h3……hN。此选择器为1.2新增
:animated	返回: <jQuery对象> 数组
匹配正在执行动画的元素。此选择器为1.2新增
:empty	返回: <jQuery对象> 数组
匹配所有没有子元素（包括文本内容）的元素
:parent	返回: <jQuery对象> 数组
匹配包含子元素（包含文本内容）的所有元素
:contains(text)	返回: <jQuery对象> 数组
匹配所有含有text的元素
:hidden	返回: <jQuery对象> 数组
匹配所有隐藏的元素，包含属性type值为hidden的元素
:visible	返回: <jQuery对象> 数组
匹配所有非隐藏的元素

E:nth-child(index/even/odd/equation)	返回: <jQuery对象> 数组
匹配所有E在其父元素下满足（index/even/odd/equation）条件的集合。注：下标从1开始
E:first-child	返回: <jQuery对象> 数组
匹配所有E在其父元素下是第一个子元素的集合。例如：HTML（<div><p id="p1"></p></div><div><p id="p2"></p><p id="p3"></p></div>"），使用$("p:first-child")，选取：<p id="p1"></p><p id="p2"></p>
E:last-child	返回: <jQuery对象> 数组
匹配所有E在其父元素下是最后一个子元素的集合。例如：同上的HTML，使用$("p:last-child")，选取：<p id="p1"></p><p id="p3"></p>
E:only-child	返回: <jQuery对象> 数组
匹配所有E是其父元素的唯一子元素的集合。例如：同上的HTML，使用$("p:only-child")，选取：<p id="p1"></p>