官方文檔的CSS選擇器太簡(jiǎn)短微酬,整理了一個(gè)比較全的堆生。
*
選擇所有節(jié)點(diǎn)
#container
選擇id為container的節(jié)點(diǎn)
.container
選擇所有class包含container的節(jié)點(diǎn)
li a
選取所有l(wèi)i 下所有a節(jié)點(diǎn)
ul + p
選取ul后面的第一個(gè)p元素
div#container > ul
選取id為container的div的第一個(gè)ul子元素
ul ~p
選取與ul相鄰的所有p元素
a[title]
選取所有有title屬性的a元素
a[]
選取所有href屬性為http://jobbole.com的a元素
a[href*="jobbole"]
選取所有href屬性值中包含jobbole的a元素
a[href^="http"]
選取所有href屬性值中以http開(kāi)頭的a元素
a[href$=".jpg"]
選取所有href屬性值中以.jpg結(jié)尾的a元素
input[type=radio]:checked
選擇選中的radio的元素
div:not(#container)
選取所有id為非container 的div屬性
li:nth-child(3)
選取第三個(gè)li元素
li:nth-child(2n)
選取第偶數(shù)個(gè)li元素