jquery選擇器之層級過濾選擇器

2021-09-01 20:24:59 字數 1347 閱讀 2767

$("ancestor descendant"):選取parent元素後所有的child元素

$("parent > child"):選取parent元素後所有的直屬child元素,何謂「直屬」,也就是第一級的意思了

$("prev + next"):prev和next是兩個同級別的元素. 選中在prev元素後面的next元素

$("prev ~ siblings"):選擇prev後面的根據siblings過濾的元素。注:siblings是過濾器

後兩個用的比較少,一般會有其他選擇器替代

$("prev + next")等價於next()

$("prev ~ siblings")等價於nextall()

例項:

第乙個div裡面的p元素。

第乙個單p元素。

div裡面的span元素。

第二個div裡面的p元素。

div裡面的span裡面的p元素。

abc 123

第二個單p元素。

單span元素。

var s = $("div p").addclass("highlight"); //選取div後面的所有p元素   結果為:p1,p3,p4

var s = $("div > p").addclass("highlight"); //選取div後 所有第一級p元素   結果為:p1,p3。p4不會選取,因為p4不是div的直屬元素

var s = $("div + p").addclass("highlight");   //選取div後面緊鄰的p元素  結果為:p2。p5不會選取,因為p5不緊鄰div

var s = $("div ~ p").addclass("highlight");     //選取div後面所有緊鄰的p元素  結果為:p2,p5

jquery基礎選擇器 層級選擇器 過濾選擇器

function 2.選擇 class 為 mini 的所有元素 btn2 click function 3.選擇 元素名是 div 的所有元素 btn3 click function 4.選擇所有的元素 btn4 click function 5.選擇所有的 span 元素和id為two的元素 2...

jQuery選擇器之層級選擇器

文件中的所有的節點之間都是有這樣或者那樣的關係。我們可以把節點之間的關係可以用傳統的家族關係來描述,可以把文件樹當作乙個家譜,那麼節點與節點直接就會存在父子,兄弟,祖孫的關係了。選擇器中的層級選擇器就是用來處理這種關係 子元素 後代元素 兄弟元素 相鄰元素 通過乙個列表,對比層級選擇器的區別 仔細觀...

jQuery選擇器之層級選擇器

若要通過dom 元素之間的層次關係來獲取元素,如後代元素,子元素,相鄰元素和同輩元素,使用jquery的層次選擇器將會是最佳選擇。jquery層次選擇器和css的層次選擇器相同,他們都是根據獲取元素與其父元素,子元素,兄弟元素等的關係而構成的選擇器。jquery中有四種層次選擇器 後代選擇器 子選擇...