大話jQuery--選擇器（2）
1.層級關系
查找子孫元素的操作比較常見，jQuery也為我們提供了一些方便的方法，我們看看吧:
1.)祖先 后代
空格隔開，這種和css中一樣
<p>
<span>測試</span><a href="#">鏈接1</a><span>|</span><a href="#" class="link">鏈接2</a>|<a href="#">鏈接3</a>
</p>
這樣 p a就表示的是p標簽下的鏈接，而其他的標簽a不包括在內，其實這是一種限定范圍的方法。赤裸的a{}代表了全部的a,也就是* a{}
每加一個限制標簽，一般范圍更小，更精確，比如div p a{}
jQuery里面這樣可以獲取
$("p a").
2.)我們有時候查找后代時，只想要第一個層面上的，也就是兒子級別上的那個，孫子重孫子那些不關心。那么下面這個派上用場了:
父 >子
對，是大于符號，表示的是父子關系
<ul>
<li>測試1</li>
<li>測試2</li>
<li>
<ol>
<li>測試31</li>
<li>測試32</li>
</ol>
</li>
</ul>
那么ul>li表示的是外層的li不包括ol里面的li，而ul li則包含。
3.pre+next
+號，表示標簽next滿足這樣一種關系，next與pre相鄰并緊隨其后。
<p>
<a href="#">鏈接1</a><span>|</span><a href="#" class="link">鏈接2</a><span>|</span><a href="#">鏈接3</a>
</p>
<p>
<a href="#">測試</a>
<b>測試b</b>
<span>測試</span>
<a href="#"><span>哈哈</span></a>
</p>
上面代碼有多少了span呢，有4個，但是有多少個緊隨a標簽之后內，只有前2個豎線的滿足，后面的第3個排在<b>后面，另外一個是嵌套。
那么
$("a+span").css({border:"1px solid red"});
只對前2個加邊框。
當然了$("a+*")就是所有標簽了，不只是限于span了。
實際中可以結合id,類構建更復雜的應用。
4.）prev~后面的兄弟
~找出后面的所有兄弟。
$("p span")表示所有的排在p后面的，那些兄弟span元素。
2.找孩子(哈哈)
1.上面的parent>child方法是所有的孩子。
如果我想要長子元素，或者最后一個，或者隨機找出某一個。
好在jquery提供了幾個偽類方便我們
:first-child,第一個子元素，
<p>
<a href="#">鏈接1</a><span>|</span><a href="#" class="link">鏈接2</a><span>|</span><a href="#">鏈接3</a>
</p>
$("p :first-child")大家可能容易知道是第一個鏈接1
但是如果是嵌套呢:
<p>
<a href="#">測試</a>
<b>測試b</b>
<span>測試</span>
<a href="#"><span>哈哈</span></a>
</p>
$("p :first-child")會得到2個，一個
<a href="#">測試</a>
這個好理解，
這個不要忘記<span>哈哈</span>，因為他對最后一個a來說也是長子，而且還是獨生子呢。
所有，記住:
：first-child是指的這些元素對于他們的父元素來說是長子的元素
:first-child和*:first-child同。
$("p *:first-child")也是可以的。
如果你只想找父子級別的，那么用
$("p>*:first-child")
還可以做限制篩選，比如$("p>a:first-child")表示的意思是，從p元素的鏈接孩子中看看有沒有長子a元素。
2.:last-child同上
3.隨機找:nth-child(n)這里n是從1開始的。
$("p :nth-child(3)")表示，在p的子孫元素里，找在他們家里排老三的。
$("p>:nth-child(3)")在孩子中找老三。
當然也可以限制還可以和id,類混用。
4.:only-child
找獨生子。
注意上面的偽類和前面講的區別
比如$("p>a:first")和$("p>a:first-child")
