1. 選擇器
jQuery其實就是對網頁進行操作的，要進行操作總得有個操作對象，jQuery就是通過選擇器選擇操作對象的。
jQuery選擇器其實就是jQuery(rule)方法，該方法通過指定選擇規則rule，傳回標明的對象。例如jQuery("div")表示選擇網頁中的div元素。
因為選擇器太常用了，是以提供了$操作符代替jQuery，$("div")明顯簡潔明了多了。（PS：其實就相當于+代替了add()函數）。
2. 選擇器用法示例
示範下最基本的幾種用法，隻要記住jQuery的選擇器基本能滿足所有選擇需求就是了，具體怎麼選擇可以去查查手冊，記住最常用的就行：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="jquery.min.js"></script>
<title></title>
</head>
<body>
<!-- 用法1，按id選擇元素，隻會比對到1個元素 -->
<div id="id1"></div>
<script>$("#id1").html("hello my id1")</script>
<!-- 用法2，按元素名稱選擇元素，會比對到所有該名稱的元素 -->
<span id="span1"></span>
<span id="span2"></span>
<script>$("span").html("hello span elements")</script>
<!-- 用法3，比對class名稱 -->
<div class="class1"></div>
<div class="class1"></div>
<script>$(".class1").html("hello elements of class1")</script>
<!-- 用法4，逗号代表同時應用多個規則，符合任何一個規則的元素都會被選中 -->
<div id="id4"></div>
<script>$("#id1,.class1").css("color","red");</script>
<!-- 用法5，"rule1 rule2"表示選中rule1内部所有rule2元素 -->
<div id="id5">
<div><span></span></div>
<div><span></span></div>
<span></span>
<span></span>
</div>
<script>$("#id5 span").html("id5's inner span");</script>
<!-- 用法6，"rule1>rule2"表示選中rule1元素内符合rule2規則的兒子輩元素，不包括孫子、重孫子等 -->
<div id="id6">
<div><span></span></div>
<div><span></span></div>
<span></span>
<span></span>
</div>
<script>$("#id6>span").html("id6's son span");</script>
<!-- 用法7，選擇第一個、最後一個、指定序号的子元素 -->
<div id="id7">
<span>1</span>
<span>2</span>
<span>3</span>
<span>4</span>
</div>
<script>
$("#id7 span:first-child").css("color","red");
$("#id7 span:last-child").css("color","green");
$("#id7 span:nth-child(3)").css("color","blue");
</script>
<!-- 用法8，選擇子元素中的奇數odd偶數even元素 -->
<div id="id8">
<span>1</span>
<span>2</span>
<span>3</span>
<span>4</span>
</div>
<script>
$("#id8 span:nth-child(odd)").css("color","red");
$("#id8 span:nth-child(even)").css("color","green");
</script>
</body>
</html>
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)