jQ學習之層級選擇器的測試

2022-07-12 22:15:21 字數 2100 閱讀 7215

一:層級選擇器 主要有以下幾種:

a b: 即選擇a中所有的b元素

a>b:既選擇 a中 所有處在第一級且屬性為b的孩子

a+b:選擇 與a相鄰的(在a後面)的b元素

a~b:選擇 a的且屬性為b的兄弟(不包括a)

html**:

1

<

input

type

="button"

id="btn1"

value

="選擇body中所有的div元素"

/>

2<

input

type

="button"

id="btn2"

value

="選擇body中第一級的孩子"

/>

3<

input

type

="button"

id="btn3"

value

="選擇id為two的元素的下乙個元素"

/>

4<

input

type

="button"

id="btn4"

value

="選擇id為one的所有兄弟元素"

/>

5<

hr />

6<

div

id="one"

>

7<

div

class

="mini"

>

8111

9div

>

10div

>

1112

<

div

id="two"

>

13<

div

class

="mini"

>

14222

15div

>

16<

div

class

="mini"

>

17333

18div

>

19div

>

2021

<

div

id="three"

>

22<

div

class

="mini"

>

23444

24div

>

25<

div

class

="mini"

>

26555

27div

>

28<

div

class

="mini"

>

29666

30div

>

31div

>

3233

<

span

id="four"

>

3435

span

>

jq**:

1

//定義乙個頁面載入函式

2 $(function

())8 $("#btn2").click(function

())12 $("#btn3").click(function

())16 $("#btn4").click(function

())20

21 })

css**:

1

div,span,p

11div.mini

17div.hide

jQuery選擇器之層級選擇器

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

jQuery選擇器之層級選擇器

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

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

ancestor descendant 選取parent元素後所有的child元素 parent child 選取parent元素後所有的直屬child元素,何謂 直屬 也就是第一級的意思了 prev next prev和next是兩個同級別的元素.選中在prev元素後面的next元素 prev s...