二)層次選擇器jquery層次選擇器
選擇器描述返回
示例$("ancestor descendant")
選取ancestor元素裡所有的descendant(後代)元素
集合元素
$("div span")選取裡的所有元素
$("parent>child")
選取parent元素下的子元素child
集合元素
$("div > span")選取下直接子元素
$("prev+next")
選取緊接在prev元素後的next元素
集合元素
$(".one+div")選取class為one的下一
個元素等同於$(".one").next("div")
$("prev~siblings")
選取prev元素之後的所有siblings元素
集合元素
$("#two ~ div")選取id為two的元素後面
的所有兄弟元素
等同於$("#two").nextall("div")
三)jquery過濾選擇器:基本過濾,內容過濾,可見性過濾,屬性過濾,子元素過濾,表單物件屬性過濾
基本過濾
選擇器描述返回
示例:first
選取第乙個元素
單個元素
$("div:first")選取所有元素中第乙個元素
:last
選取最後乙個元素
單個元素
$("div:last")選取所有元素中最後乙個元素
:not(seletor)
除去所有與給定選擇器匹配的元素
集合元素
$("input:not(.myclass)")選取class不是myclass的元素
:even
選取索引是偶數的所有元素,索引從0開始
集合元素
$("input:even")選取索引是偶數的元素
:odd
選取索引是奇數的所有元素,索引從0開始
集合元素
$("input:odd")選取索引是奇數的元素
:eq(index)
選取索引等於index的元素,索引從0開始
單個元素
$("input:eq(1)")選取索引是1的元素
:gt(index)
選取索引大於index的元素,索引從0開始
集合元素
$("input:gt(1)")選取索引大於1的元素,不包括1
:lt(index)
選取索引小於index的元素,索引從0開始
集合元素
$("input:lt(1)")選取索引小於1的元素,不包括1
:header
選取所有的標題元素,如h1,h2……
集合元素
$(":header")選取網頁中所有的,,……
:ainmated
選取當前正在執行動畫的所有元素
集合元素
$("div:animated")選取正在執行動畫的元素
內容過濾
選擇器描述返回
示例:contains(text)
選取含有文字內容為「text」的元素
集合元素
$("div:contains('wo')")選取
含有文字『wo』的div元素
:empty
選取不包換子元素或文字的空元素
集合元素
$("div:empty")選取不包換子元素
的空元素
:has(selector)
選取含有選擇器所匹配的元素的元素
集合元素
$("div:has(p)")選取含有元素
的元素:parent
選取含有子元素或者文字的元素
集合元素
$("div:parent")選取游泳子元素
的元素
可見性過濾
選擇器描述返回
示例:hidden
選取所有不可見元素
集合元素
$(":hidden")選取所有不可見的元素,包括,
,等元素。
如果只想選取元素,可以使用$("input:hidden")
:visible
選取所有可見元素
集合元素
$("div:visible")選取所有可見的元素
屬性過濾
選擇器描述返回
示例[attribute]
選取擁有此熟悉的元素
集合元素
$("div[id]")選取擁有屬性id的元素
[attribute=value]
選取屬性的值為value的元素
集合元素
$("div[title=test]")選取屬性title為「test」的元素
[attribute!=value]
選取屬性的值不等於value的元素
集合元素
$("div[title!=test]")選取屬性title不為「test」的
元素,注意:沒有屬性title的元素也會被選取
[attribute^=value]
選取屬性的值以value開始的元素
集合元素
$("div[title^=test]")選取屬性title以「test」開始
的元素[attribute$=value]
選取屬性的值以value結束的元素
集合元素
$("div[title$=test]")選取屬性title以「test」結束
的元素[attribute*=value]
選取屬性的值含有value的元素
集合元素
$("div[title*=value]")選取屬性title含有「test」
的元素[selector1][selector2]
[selectorn]
用屬性選擇器合併成乙個復合屬性
選擇器,滿足多個條件,沒選擇一
次,縮小一次範圍
集合元素
$("div[id][title$='test']")選取擁有屬性id並且屬性
title以「test」結束的元素
子元素過濾
選擇器描述返回
示例:nth-child(index/even/
odd/equation)
選取每個父元素下的第index個子元素
或者奇偶元素(index從1算起)
集合元素
:eq(index)只匹配乙個元素,而:nth-child為每個父元素匹配
子元素並且:nth-child(index)的index是從1開始的,
而:eq(index)是從0開始的
:first-child
選取每個父元素的第乙個子元素
集合元素
:first只返回單個元素,而:first-child選擇符為每個父元素匹配
第乙個子元素。
例如:$("ul li:first-child");選取每個中第乙個
:last-child
選取每個父元素的最後乙個子元素
集合元素
:last只返回單個元素,:last-child為每個父元素匹配最後乙個
子元素例如:$("ul li:last-child");選擇每個中的最後乙個
:only-child
如果某個元素是他父元素中的唯一
子元素,那麼將會被匹配。如果
父元素中含有其他元素,則不會
匹配集合元素
$("ul li:only-child") 在中選取是唯一子元素的元素
jQuery選擇器(三)
子元素過濾選擇器 l nth child 選擇器詳解如下 1 nth child even odd 能選取每個父元素下的索引值為偶 奇 數的元素 2 nth child 2 能選取每個父元素下的索引值為2 的元素 3 nth child 3n 能選取每個父元素下的索引值是3 的倍數的元素 3 nth...
三 jQuery選擇器
1 層次選擇器 4 p div 選取p元素下的所有div p div 選取p元素 下的div子元素 p div 選取p元素的一下個 同胞div元素 等價於 p next div p div 選取p元素後面所有 同胞div元素 等價於 p nextall div 後面的同輩 對比 p siblings...
Jquery選擇器(三)
過濾選擇器 4 屬性過濾器 查詢所有含有 id 屬性的 div 元素 document ready function test1 test2 查詢所有name是qin的input並選中 document ready function 查詢所有name不是qin的input並選中 document r...