《選擇器》 四 子代選擇器和後代選擇器

2022-06-02 07:24:05 字數 1993 閱讀 3584

1

doctype html

>

2<

html

lang

="cn"

>

3<

head

>

4<

meta

charset

="utf-8"

>

5<

title

>title

title

>

6head

>

7<

body

>

8<

div

id="father"

>

9<

div

class

="red"

>1

div>

10<

div>211

<

p>21

p>

12<

p>22

p>

13<

p>23

p>

14<

p>21

p>

15<

p>22

p>

16<

p>23

p>

17div

>

18<

div

class

="green"

>3

div>

19<

p>4

p>

20<

p id

="green"

>5

p>

21<

p>6

p>

22div

>

23body

>

24<

script

src="jquery-2.1.1.min.js"

>

script

>

25<

script

>

26/*

27* $("s1s2") 交集選擇器

28* $("s1, s2") 並集選擇器

29* $("s1 > s2") 子代選擇器

30* $("s1 s2) 後代選擇器

31*

*/32

33//

後代選擇器

34$(

"#father p

").css(

"backgroundcolor",

"pink");

3536

//子代選擇器

37$(

"#father>p

").css(

"backgroundcolor",

"blue");

3839

//交集選擇器

40$(

"div.red

").css(

"backgroundcolor",

"red");

4142

//並集選擇器

43$(

".green, #green

").css(

"backgroundcolor",

"green");

4445

//過濾選擇器, even下標為基數的標籤

46$(

"div>div>p:even

").css(

"backgroundcolor",

"cyan");

4748

//過濾選擇器, eq等於下標為多少的標籤

49$(

"div>div>p:eq(2)

").css(

"backgroundcolor",

"orange");

5051

script

>

52html

>

後代選擇器和子選擇器

後代選擇器 h1 em 選擇器可以解釋為 作為 h1 元素後代的任何 em 元素 有關後代選擇器有乙個易被忽視的方面,即兩個元素之間的層次間隔可以是無限的。例如,如果寫作 ul em,這個語法就會選擇從 ul 元素繼承的所有 em 元素,而不論 em 的巢狀層次多深。div01 ul li div0...

後代選擇器

後代選擇器 找到指定標籤的所有特定的後代標籤,設定屬性。1.什麼是後代選擇器?作用 找到指定標籤的所有特定的後代標籤,設定屬性 格式 標籤名稱1 標籤名稱2 先找到所有名稱叫做 標籤名稱1 的標籤,然後再在這個標籤下面去查詢所有名稱叫做 標籤名稱2 的標籤,然後在設定屬性 div p 注意點 1.後...

後代選擇器和子元素選擇器

1.後代選擇器和子元素選擇器之間的區別?1.1 後代選擇器使用空格作為連線符號 子元素選擇器使用 作為連線符號 1.2 後代選擇器會選中指定標籤中,所有的特定後代標籤,也就是會選中兒子 孫子 只要是被放到指定標籤中的特定標籤都會被選中 子元素選擇器只會選中指定標籤中,所有的特定的直接標籤,也就是只會...