jQuery 選擇器
本節我們來學習 jQuery 中的選擇器，選擇器是 jQuery 庫中最重要的部分之一。
jQuery選擇器
jQuery 選擇器允許我們選取和操作 HTML 元素，它用於根據 HTML 元素的名稱、ID、類、型別、屬性和屬性值等來查詢 HTML 元素。除了基於現有的 CSS 選擇器，它還有一些自己自定義的選擇器。
要注意 jQuery 中的所有選擇器都以美元符號和圓括號開頭，例如 $()。
元素選擇器
jQuery 元素選擇器是根據元素名稱匹配相對應的元素。也就是說它是根據元素的標籤名來選擇的，指向的是 DOM 元素的標籤名。
示例：
例如有下面一段 HTML 程式碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery_俠課島(9xkd.com)</title>
</head>
<body>
<h2>你好，歡迎來到俠課島！</h2>
<div>
<p>俠課島的學習課程：</p>
<ul>
<li class="course">Python</li>
<li class="course">前端</li>
<li class="course">Java</li>
<li class="course">PHP</li>
</ul>
<div>
<button>點選按鈕</button>
</div>
</div>
</body>
</html>
如果我們要在這個頁面中寫入 jQuery 程式碼，首先需要引入 jQuery 檔案，格式如下所示：
<script src="jquery-3.5.1.min.js"></script>
這表示我們引入的 jquery-3.5.1.min.js 和 index.html 檔案位於同一目錄下。
接著我們要在一個新的 <script> 標籤中編寫 jQuery 程式碼，注意一定要另外寫一個 <script> ，不能寫在 引入檔案的 <script> 標籤中喲。
例如要實現點選頁面中的按鈕，隱藏所有 <li> 標籤的效果：
<script>
$(function(){
$("button").click(function(){
$("li").hide();
});
});
</script>
上述程式碼中，最開始是一個 jQuery 的載入函式 $(function(){})，這個我們前面一節講到過。然後在 button 標籤選擇器上綁定了一個 click() 點選事件，表示當點選元素時，會觸發這個點選事件。然後會執行點選事件中的函式，這函式中的 $("li").hide() 表示選取頁面所有的 <li> 標籤然後進行隱藏，hide() 就是一個隱藏元素方法。
在瀏覽器中的演示效果： 
class類選擇器
jQuery 類選擇器可以通過指定的 class 來查詢元素。語法和標籤選擇器有一點區別，就是需要在類選擇器名稱前面加上一個點號.。
示例：
例如下面這段程式碼，其實和上述元素選擇器中的示例效果差不多，不同的是這表示對頁面中所有 class="course" 的元素進行隱藏：
<script>
$(function(){
$("button").click(function(){
$(".course").hide();
});
});
</script>
雖然在本節教程中這兩個示例的在瀏覽器中的演示效果是一樣的，但是還有有很大的區別，對於前一個示例來說，只要是標籤為 <li> 的元素都會進行隱藏，而對於此示例來說，只有設定了 class="course" 的元素才會進行隱藏。
ID選擇器
jQuery 中的 ID 選擇器通過 HTML 元素的 id 屬性來查詢指定的元素。一個 ID 在一個頁面中應該是唯一的，所以當我們想要選取唯一的元素時，應該使用 ID 選擇器。
示例：
例如獲取頁面中 id 為 xkd 的元素文字內容，並通過 alert() 方法顯示在瀏覽器中：
alert($("#xkd").text());
我們在使用 ID 選擇器時，需要在選擇器前面加上一個井號 #。text() 方法可以用於返回所選元素的文字內容。
在瀏覽器中的演示效果：
JQuery 中的其他選擇器
除了標籤選擇器、類選擇器、ID選擇器，JQuery 中還有一些自定義的選擇器，如下所示：
| 語法 | 描述 |
|---|---|
| $("*") | 選取所有元素 |
| $(this) | 選取當前 HTML 元素 |
| $("p.xkd") | 選取所有 class="xkd" 的 <p> 元素 |
| $("p:first") | 選取第一個 <p> 元素 |
| $("ul li:first") | 選取第一個 <ul> 元素下的第一個 <li> 元素 |
| $("ul li:first-child") | 選取每個 <ul> 元素下的第一個 <li> 元素 |
| $("[href]") | 選取所有具有 href 屬性的元素 |
| $(a[target='_blank']) | 選取所有目標屬性值等於 _blank 的 <a> 元素 |
| $(a[target!='_blank']) | 選取所有目標屬性值不等於_blank 的<a> 元素 |
| $("div#xkd .good") | 選取 id="xkd" 的 <div> 元素中的所有 class="good" 的元素 |
| $("tr:even") | 選取所有偶數位置的 <tr> 元素 |
| $("tr:odd") | 選取所有奇數位置的 <tr> 元素 |