《鋒利的jQuery》 層次選擇器

2021-08-15 23:00:04 字數 1462 閱讀 6730

如css 一樣,jquery可通過dom元素之間的關係來選擇特定的元素,如後代元素、子元素、相鄰元素和同輩元素等。css選擇器參考(座標:網頁底部)。

層次選擇器

選擇器描述返回

示例$("ancestor descendant")

選取ancestor元素裡的所有descendant(後代)元素,後代:子代,孫代等等

集合元素

$("div span")選取裡所有的

$("parent>child")

選取parent元素的子元素

集合元素

$("div>span")選取元素下的子代

$("prev+next")

選取緊接在prev元素後的next元素

集合元素

$(".one+div")選取class為one的下乙個同輩元素

$("prev~siblings")

選取prev元素之後的所有siblings元素

集合元素

$("#two~div")選取id為two的元素後面的所有同輩元素

演示:$("ancestor descendant"):

//改變內所有的背景色

//改變內子元素背景

//改變class為one的下乙個同輩元素背景

//改變id為two元素後面所有同輩元素背景

上述四種選擇器,後兩種有更為簡單的等價方法:

1.$(".one+div")可以寫成$(".one").next("div")

2.$("#prev~div")可以寫成$("#prev").nextall("div")

JQuery 選擇器(鋒利的Jquery

prev div 選擇 id 為prev 後面的所有同輩元素 prev nextall div 同上 prev siblings div 選擇 id 為prev 所有同輩元素 prev div 選擇 id 為prev 後乙個同輩元素,仍然返回集合元素 parent child 相當於 parent ...

鋒利的jquery 選擇器

1 基本選擇器 id class element 注 css background bbffaa 表示 改變所有元素 的背景色 2 層次選擇器 div span 選取裡的所有的元素 div span 選取元素下,元素名為的子元素 one div 選取class為one的 下乙個元素 one next...

鋒利的jquery 選擇器

2011 3 23 jquery 選擇器 1 基本選擇器 id class element 注 css background bbffaa 表示 改變所有元素 的背景色 2 層次選擇器 div span 選取裡的所有的元素 div span 選取元素下,元素名為的子元素 one div 選取clas...