層級選擇器:
總共有4
種:子元素選擇器、後代元素選擇器、緊鄰同輩元素選擇器、相鄰同輩元素選擇器。
1】子元素選擇器:用於在給定父元素下查詢父元素下的子元素。
語法:$(
「parent>child
」)//parent為任意有效的選擇器;
child
也是乙個選擇器,且是
parent
的子元素。
eg:
匹配form
下所有的
input
標籤: $(「
form>input
」)//找到的只是
form
下的。結果是
」title
」/>
2】後代元素選擇器:用於在給定的祖先元素下匹配所有的後代元素
語法:$(
「ancestor descendant
」)//ancestor 為任意有效的選擇器;
descendant
也是乙個選擇器,可能是
ancestor
的子元素、孫元素、重孫元素。
eg:
匹配form
後代標籤中的
input
標籤: $(「
form input」)
結果: 」
news1
」type=
」text
」value=
」text1
」/> 」
news2
」type=
」text
」value=
」text1
」/>
3】緊鄰同輩元素選擇器:用於匹配所有緊接在
prev
元素後的
next元素
語法:$(
「prev+next
」)//prev為任意有效的選擇器
,next
為緊接著
prev
選擇器的乙個選擇器
eg:
匹配div
後邊的span
元素: $(「
div+span」)
結果:span1
4】相鄰同輩元素選擇器:用於選擇某元素後邊的所有
同輩元素
語法:$(
「prev~siblings」)
eg:
」text
」/> 」
text
」/>
段落標記
用jquery
改變input
元素和p
元素的樣式
$(document).ready(function())
綜合例子:
效果圖:
jQuery選擇器之層級選擇器
文件中的所有的節點之間都是有這樣或者那樣的關係。我們可以把節點之間的關係可以用傳統的家族關係來描述,可以把文件樹當作乙個家譜,那麼節點與節點直接就會存在父子,兄弟,祖孫的關係了。選擇器中的層級選擇器就是用來處理這種關係 子元素 後代元素 兄弟元素 相鄰元素 通過乙個列表,對比層級選擇器的區別 仔細觀...
jQuery選擇器之層級選擇器
若要通過dom 元素之間的層次關係來獲取元素,如後代元素,子元素,相鄰元素和同輩元素,使用jquery的層次選擇器將會是最佳選擇。jquery層次選擇器和css的層次選擇器相同,他們都是根據獲取元素與其父元素,子元素,兄弟元素等的關係而構成的選擇器。jquery中有四種層次選擇器 後代選擇器 子選擇...
jquery選擇器之層級過濾選擇器
ancestor descendant 選取parent元素後所有的child元素 parent child 選取parent元素後所有的直屬child元素,何謂 直屬 也就是第一級的意思了 prev next prev和next是兩個同級別的元素.選中在prev元素後面的next元素 prev s...