Jquery入门学习篇--选择器（一）
html示例代码，该代码下载自网站http://www.manning.com/bibeault/，<div>
<label>Some images:</label>
</div>
<div>
<img src="images/image.1.jpg" id="hibiscus" alt="Hibiscus"/>
<img src="images/image.2.jpg" id="littleBear" title="A dog named Little Bear"/>
<img src="images/image.3.jpg" id="verbena" alt="Verbena"/>
<img src="images/image.4.jpg" id="cozmo" title="A puppy named Cozmo"/>
<img src="images/image.5.jpg" id="tigerLily" alt="Tiger Lily"/>
<img src="images/image.6.jpg" id="coffeePot"/>
</div>
<div id="someDiv">This is a <div> with an id of <tt>someDiv</tt>
</div>
<div title="myTitle1">
<span>Hello</span>
</div>
<div title="myTitle2">
<span>Goodbye</span>
</div>
<ul class="myList">
<li>
<a href="http://jquery.com">jQuery supports</a>
<ul>
<li>
<a href="css1">CSS1</a>
</li>
<li>
<a href="css2">CSS2</a>
</li>
<li>
<a href="css3">CSS3</a>
</li>
<li>Basic XPath</li>
</ul>
</li>
<li>jQuery also supports <ul>
<li>Custom selectors</li>
<li>Form selectors</li>
</ul>
</li>
</ul>
<table id="languages" border="0" cellspacing="1">
<thead>
<tr>
<th>Language</th>
<th>Type</th>
<th>Invented</th>
</tr>
</thead>
<tbody>
<tr>
<td>Java</td>
<td>Static</td>
<td>1995</td>
</tr>
<tr>
<td>Ruby</td>
<td>Dynamic</td>
<td>1993</td>
</tr>
<tr>
<td>Smalltalk</td>
<td>Dynamic</td>
<td>1972</td>
</tr>
<tr>
<td>C++</td>
<td>Static</td>
<td>1983</td>
</tr>
</tbody>
</table>
<form action="" method="put" onsubmit="return false;">
<div>
<label>Text:</label>
<input type="text" id="aTextField" name="someTextField"/>
</div>
<div>
<label>Radio group:</label>
<input type="radio" name="radioGroup" id="radioA" value="A"/> A <input type="radio" name="radioGroup" id="radioB" value="B"/> B <input type="radio" name="radioGroup" id="radioC" value="C"/> C </div>
<div>
<label>Checkboxes:</label>
<input type="checkbox" name="checkboxes" id="checkbox1" value="1"/> 1 <input type="checkbox" name="checkboxes" id="checkbox2" value="2"/> 2 <input type="checkbox" name="checkboxes" id="checkbox3" value="3"/> 3 <input type="checkbox" name="checkboxes" id="checkbox4" value="4"/> 4 </div>
<button type="submit" id="submitButton">Submit</button>
</form>
1.$("a")---------------匹配所有a标签
2.$(".myList")-------------匹配class为myList的元素
3.$("#languages")--------匹配id为languages的元素
4.$(".myList li a[href^=http]")------匹配class为myList元素下的所有li元素下的说有a元素，且href以http打头
5.$("ul.myList li a")与$("ul.myList>li>a")比较
$("ul.myList li a")-------匹配所有ul且class为myList下所有li的所有a元素
$("ul.myList>li>a")----------匹配所有ul且class为myList下直接子元素li下直接a元素
6.$("a[href=http]") ------------- =匹配相等
$("a[href^=http]") ------------- ^匹配以此开头
$("a[href$=com]")--------------$匹配以此结尾
$("a[href*=http]") ------------- *匹配包含http
$("ul.myList +table")----------+匹配ul.myList下紧跟着的table元素 即A和B元素紧挨着的
$("ul.myList ~table")----------~匹配ul.myList下的所有table元素 即A和B元素不用紧挨着的
7.$("ul:has(li)")--------------e:has()匹配ul下有li的所有ul元素
8.通过位置选择
$("ul:last")------------第一个
$("ul:last")--------------最后一个
$("ul li:first-child")----------匹配所有ul下的第一个li
$("ul li:last-child")----------匹配所有ul下的最后一个li
$("a:only-child")-----------匹配所有没有兄弟节点的a元素
$("li:nth-child(1)")---------------返回并列li元素的第一个 :nth-child(n) n从1开始
$("li:nth-child(odd)")---------------返回并列li元素偶数元素
$("li:eq(0)")---------------------eq匹配li的第一个元素 eq计数从0开始
$("li:gt(3)")---------------gt(n)匹配所有并列li且第n个之后的li元素 不包括n n从0开始
$("li:lt(3)")---------------gt(n)匹配所有并列li且第n个之前的li元素 不包括n n从0开始
$("li:nth-child(even)")---------------返回并列li元素基数元素