jQuery选择器大全。

本文详细介绍了CSS选择器的使用方法,包括基本选择器、属性选择器、伪类和伪元素,以及jQuery提供的元素操作方法,如过滤、添加、查找等,帮助读者深入理解并灵活运用这些技术。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

过滤器:

#id:
匹配id属性为id的元素。通常作为独立选择器使用。

.class:
匹配class属性,含有class属性的单词的所有元素。

[attr]:
匹配拥有attr属性所有的元素。

[attr=val]:
匹配拥有attr属性且值为val的所有元素。

[attr!=val]:
匹配没有attr属性,或者attr的值不为val的所有选择器。

[attr^=val]:
匹配attr属性值以val开头的元素。

[attr$=val]:
匹配attr属性值以val结尾的元素。

[attr*=val]:
匹配attr属性值含有val的元素。

[attr~=val]:
空格分隔的单词列表时,匹配其中包含val的元素。

[attr!=val]:
匹配attr属性值以val开头,且后面没有其他字符。

:animated :
匹配正在动画的元素。

:button :
匹配按钮button的type值为button或input的type。

:checkbox:
匹配input标签type为checkbox的。

:contains(text):
匹配含有指定text文本的元素。

:disabled:
匹配禁用的元素。

:empty:
匹配没有子节点,文本内容的元素。

:enabled:
匹配没有禁用的元素。

:eq(index):
匹配基于文档顺序,序列号从0开始的选中列表中的第index个元素。

:even:
匹配列表中偶数的元素。

:file:
匹配input中的type值为file。

:first:
匹配列表中的一个元素。

:first-child:
匹配元素是其父元素的第一个子元素。

:gt(index):
匹配 index 值大于指定index的元素。

:has(sel):
匹配元素拥有匹配内嵌选择器sel的子孙元素。

:header :
匹配所有头元素===>h1 到 h6

:hidden:
匹配所有在屏幕上不可见的元素。

:image:
匹配input中type为image的。

:input:
匹配用户输入元素。

:last:
匹配选中列表中的最后一个元素。

:last-child:
匹配其元素的父节点的最后一个元素。

:lt(index):
匹配 index 值小于指定index的元素。

:nth(n):
匹配基于文档顺序,序列号从0开始的选中列表中的第index个元素。

:not(sel):
匹配元素不匹配内嵌选择器sel。

:nth-child(n):
匹配元素是父节点的第n个元素。

:odd:
匹配列表中的奇数。

:only-child:
匹配那些是父节点唯一子节点的元素。

:parent:
匹配是父节点的元素,匹配有子节点,文本内容的元素。

:password:
匹配input中的type为password。

:radio:
匹配input中的type为radio。

:reset:
匹配input中的type为reset。

:selected:
匹配选中的option元素。

:submit:
匹配input中的type为submit。

:text:
匹配input中的type为text。

:visible:
匹配所有可见的元素。

组合选择器:

A B :
匹配选择器A的元素的子孙元素,选取匹配B的文档元素。

A>B:
匹配选择器A的子元素,选取匹配B的文档元素。

A+B:
匹配选择器A元素的下一个兄弟元素中,选中匹配B的文档元素。

A~B:
匹配选择器A元素后面的兄弟元素中,选中匹配B的文档元素。

选取方法:

last():
选取最后一个元素。

first():
选取第一个元素。

eq(index):
选取index个元素。

slice(开始位置,结束位置)。
负数会从结尾处计算。

filter(item)://类似过滤
选取item元素。
如果是函数,则返回匹配好的元素。

not(a,b):
选取a与b之外的元素。

has():
返回一个新的jquery对象,包含子孙匹配该选择器的选中元素。

add():
扩充选区。会移除重复元素。

find(element):
在每一个当前选中的元素的子孙元素中,找到指定的element元素。

children():
返回每一个选中的直接子元素。
$(‘p’).children(‘span’) ===> 找到p元素子节点为span的所有元素。

next():
返回每个选中的元素的下一个兄弟元素。

prev():
返回每个选中的元素的上一个兄弟元素。

nextAll():
返回每个选中的元素的后面的所有兄弟元素。

prevAll(‘p’):
无选择器==>返回每个选中元素的前面所有兄弟元素。
有选择器p 返回每个选中元素的前面所有 p标签 兄弟元素

parent():
返回每个选中的父节点。接收一个可选的选择器。

parents():
返回每个选中的祖先节点。接收一个可选的选择器。

parentsUntil():
返回每个选中的祖先元素。

closest():
传入一个选择器,返回每个选中元素的祖先元素。匹配该选择器中最近一个祖先元素。

end():
匹配元素还原到之前的状态。

pushStack():
可以将元素集作为数组或类数组对象传递给该方法。指定的元素会成为新的选中元素。之前的元素集则会压入栈中,可用end还原。

andSelf():
返回新的jquery对象,包含当前所有选中元素,加上之前选中的所有元素。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值