面試題：css選擇器和jq選擇器的相同點和不同點，你怎么使用的？

其實我覺得面試題是小事，主要是我們要掌握這些知識。其實jq提供了很多選擇器，除了CSS的本身提供的選擇器外新增了不少，具體看下面的內容。

CSS選擇器有11種：通用選擇器、標簽選擇器（元素選擇器）、類選擇器（class選擇器）、ID選擇器、群組選擇器、后代選擇器、子代選、兄弟選擇器（臨近選擇器）、屬性選擇器、偽類選擇器、偽元素選擇器。

具體講解請參考本人云盤公共鏈接：css選擇器及簡書你所不知道的css高效編寫方法。

css本身的選擇器就不啰嗦了，下面說說JQ選擇器的種類，以及使用時注意事項。

1.基本選擇器

ID選擇器、類選擇器（class）、通用、標簽、群組選擇器等。

2.層次選擇器

后代選擇器：$('parent? children') ，可使用$('parent').children()替代。

子代選擇器：$('parent >child')

臨近選擇器：$('pre+next')，可用$('pre').next()替代。

兄弟選擇器：$('pre~nextAll'),，可使用$('pre').nextAll()替代。

除此之外，JQ中pre()查找上一個兄弟，siblings()查找所有兄弟。

3.過濾選擇器

a.基本過濾選擇器

注意：將所有選中元素放在一個集合中，并且從“0”編號，不管其是否在一個相同的父元素下。

基本過濾選擇器

b.內容過濾選擇器

內容過濾選擇器

c.屬性過濾選擇器

屬性過濾選擇器

d.可見性過濾選擇器

注意:hidden，包含display:none/hidden、visibility:hidden、input中type=hidden。

可見性過濾選擇器

e.子元素過濾選擇器

VS 基本過濾選擇器

基本過濾選擇器: eq(index)只匹配一個元素，index從0開始，不按父元素分組。

子元素過濾選擇器:nth-child 將為每個符合條件的父元素匹配子元素，index是從1開始。

子元素過濾選擇器

f.表單對象屬性過濾選擇器

表單屬性過濾選擇器

?聲明：圖片為《鋒利的jq》內容，僅供參考。