jQuery 選擇器?

?

基本選擇器

1、#myid 返回: <jQuery對象> ：匹配一個id為myid的元素。
2、element 返回: <jQuery對象> 數組：匹配所有的element元素
3、.myclass 返回: <jQuery對象> 數組：匹配所有class為myclass的元素
4、* 返回: <jQuery對象> 數組：匹配所有元素。該選擇器會選擇文檔中所有的元素，包括html，head，body
5、selector1,selector2,selectorN 返回: <jQuery對象> 數組：匹配所有滿足selector1或selector2或selectorN的元素

層次選擇

1、elementParent elementChild 返回: <jQuery對象> 數組
匹配elementParent下的所有子元素elementChild。例如：$("div p") 選擇所有div下的p元素
2、elementParent > elementChild 返回: <jQuery對象> 數組
匹配elementParent下的子元素elementChild。例如：$("div>p") 選擇所有上級元素為div的p元素
3、prev+next 返回: <jQuery對象> 數組
匹配prev同級之后緊鄰的元素next。例如：$("h1+div") 選擇所有div同級之前為h1的元素（<h1 /><div />）
4、prev ~ siblings 返回: <jQuery對象> 數組
匹配prev同級之后的元素siblings。例如：$("h1~div") 可以匹配（<h1 /><div /><div />）

基本濾鏡

1、:first 返回: <jQuery對象> ：匹配第一個元素
2、:last 返回: <jQuery對象> ：匹配最后一個元素
3、:not(selector) 返回: <jQuery對象> 數組 ：匹配不滿足selector的元素
4、:has(selector) 返回: <jQuery對象> 數組 ：匹配包含滿足selector的元素。此選擇器為1.2新增
5、:even 返回: <jQuery對象> 數組 ：從匹配的元素集中取序數為偶數的元素。
6、:odd 返回: <jQuery對象> 數組 ：從匹配的元素集中取序數為奇數的元素。
7、:eq(index) 返回: <jQuery對象> 數組：從匹配的元素集中取第index個元素
8、:gt(index) 返回: <jQuery對象> 數組 ：從匹配的元素中取序數大于index的元素
9、:lt(index) 返回: <jQuery對象> 數組 ：從匹配的元素中取序數小于index的元素
10、:header 返回: <jQuery對象> 數組 ：匹配所有的標題元素，例如h1，h2，h3……hN。此選擇器為1.2新增
11、:animated 返回: <jQuery對象> 數組 ：匹配正在執行動畫的元素。此選擇器為1.2新增
12、:empty 返回: <jQuery對象> 數組 ：匹配所有沒有子元素（包括文本內容）的元素
13、:parent 返回: <jQuery對象> 數組 ：匹配包含子元素（包含文本內容）的所有元素
14、:contains(text) 返回: <jQuery對象> 數組：匹配所有含有text的元素
15、:hidden 返回: <jQuery對象> 數組 ：匹配所有隱藏的元素，包含屬性type值為hidden的元素
16、:visible 返回: <jQuery對象> 數組 ：匹配所有非隱藏的元素

子元素濾鏡

1、E:nth-child(index/even/odd/equation) 返回: <jQuery對象> 數組
匹配所有E在其父元素下滿足（index/even/odd/equation）條件的集合。注：下標從1開始
2、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>?
3、E:last-child 返回: <jQuery對象> 數組
匹配所有E在其父元素下是最后一個子元素的集合。例如：同上的HTML，使用$("p:last-child")，選取：<p id="p1"></p><p id="p3"></p>
4、E:only-child 返回: <jQuery對象> 數組
匹配所有E是其父元素的唯一子元素的集合。例如：同上的HTML，使用$("p:only-child")，選取：<p id="p1"></p>

表單濾鏡

1、:input 返回: <jQuery對象> 數組 ：匹配所有的input、textarea、select、button
2、:text 返回: <jQuery對象> 數組 ：匹配文本域。注：在IE瀏覽器下，選擇的對象是所有type屬性為text的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為text的元素
3、:password 返回: <jQuery對象> 數組 ：匹配密碼域。注：在IE瀏覽器下，選擇的對象是所有type屬性為password的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為password的元素
4、:radio 返回: <jQuery對象> 數組 ：匹配單選按鈕。注：在IE瀏覽器下，選擇的對象是所有type屬性為radio的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為radio的元素
5、:checkbox 返回: <jQuery對象> 數組：匹配復選框。注：在IE瀏覽器下，選擇的對象是所有type屬性為checkbox的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為checkbox的元素
6、:submit 返回: <jQuery對象> 數組 ：匹配提交按鈕。注：在IE瀏覽器下，選擇的對象是所有type屬性為submit的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為submit的元素和button元素type屬性為空或為submit的元素
7、:image 返回: <jQuery對象> 數組 ：匹配圖像域。注：在IE瀏覽器下，選擇的對象是所有type屬性為image的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為image的元素
8、:reset 返回: <jQuery對象> 數組 ：匹配重置按鈕。注：在IE瀏覽器下，選擇的對象是所有type屬性為reset的元素，在非IE瀏覽器下，選擇的對象是input或button元素type屬性為reset的元素
9、:button 返回: <jQuery對象> 數組 ：匹配按鈕。注：在IE瀏覽器下，選擇的對象是所有type屬性為button的元素和元素名為button的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為button的元素和元素名為button的元素
10、:file 返回: <jQuery對象> 數組 ：匹配文件域。注：在IE瀏覽器下，選擇的對象是所有type屬性為file的元素，在非IE瀏覽器下，選擇的對象是input元素type屬性為file的元素
11、:enabled 返回: <jQuery對象> 數組 ：匹配所有可用的元素。注：即:not(:disabled)，參考:disabled的注釋
12、:disabled 返回: <jQuery對象> 數組 ：匹配所有禁用的元素。注：在非IE瀏覽器下，選擇的對象是禁用的表單元素
13、:checked 返回: <jQuery對象> 數組 ：匹配所有被選中的表單。注：在IE瀏覽器下，選擇的對象是含有checked屬性的所有元素
14、:selected 返回: <jQuery對象> 數組 ：匹配所有選擇的表單。注：在IE瀏覽器下，選擇的對象是含有selected屬性的所有元素

屬性濾鏡

1、[attribute] 返回: <jQuery對象> 數組 ：匹配擁有attribute屬性的元素
2、[attribute=value] 返回: <jQuery對象> 數組 ：匹配屬性attribute為value的元素
3、[attribute!=value] 返回: <jQuery對象> 數組 ：匹配屬性attribute不為value的元素
4、[attribute^=value] 返回: <jQuery對象> 數組 ：匹配屬性attribute的值以value開始的元素
5、[attribute$=value] 返回: <jQuery對象> 數組 ：匹配屬性attribute的值以value結尾的元素
6、[attribute*=value] 返回: <jQuery對象> 數組 ：匹配屬性attribute的值包含value的元素
7、[selector1][selector2][selectorN] 返回: <jQuery對象> 數組 ：匹配滿足屬性選擇器selector1、selector2、selectorN的元素

總結

以上是生活随笔為你收集整理的【引用】jQuery 选择器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。