# jQuery 選擇器 **選擇器允許您對元素組或單個元素進行操作。** ## jQuery 選擇器 在前面的章節中，我們展示了一些有關如何選取 HTML 元素的實例。 關鍵點是學習 jQuery 選擇器是如何準確地選取您希望應用效果的元素。 jQuery 元素選擇器和屬性選擇器允許您通過標簽名、屬性名或內容對 HTML 元素進行選擇。 選擇器允許您對 HTML 元素組或單個元素進行操作。 在 HTML DOM 術語中： 選擇器允許您對 DOM 元素組或單個 DOM 節點進行操作。 ## jQuery 元素選擇器 jQuery 使用 CSS 選擇器來選取 HTML 元素。 $("p") 選取 &lt;p&gt; 元素。 $("p.intro") 選取所有 class="intro" 的 &lt;p&gt; 元素。 $("p#demo") 選取所有 id="demo" 的 &lt;p&gt; 元素。 ## jQuery 屬性選擇器 jQuery 使用 XPath 表達式來選擇帶有給定屬性的元素。 $("[href]") 選取所有帶有 href 屬性的元素。 $("[href='#']") 選取所有帶有 href 值等于 "#" 的元素。 $("[href!='#']") 選取所有帶有 href 值不等于 "#" 的元素。 $("[href$='.jpg']") 選取所有 href 值以 ".jpg" 結尾的元素。 ## jQuery CSS 選擇器 jQuery CSS 選擇器可用于改變 HTML 元素的 CSS 屬性。 下面的例子把所有 p 元素的背景顏色更改為紅色： ### 實例 ``` $("p").css("background-color","red"); ``` ## 更多的選擇器實例 | 語法 | 描述 | | --- | --- | | $(this) | 當前 HTML 元素 | | $("p") | 所有 `<p>` 元素 | | $("p.intro") | 所有 class="intro" 的 `<p>` 元素 | | $(".intro") | 所有 class="intro" 的元素 | | $("#intro") | id="intro" 的元素 | | $("ul li:first") | 每個 `<ul>` 的第一個 `<li>` 元素 | | $("[href$='.jpg']") | 所有帶有以 ".jpg" 結尾的屬性值的 href 屬性 | | $("div#intro .head") | id="intro" 的 `<div>` 元素中的所有 class="head" 的元素 | 如需完整的參考手冊，請訪問我們的 [jQuery 選擇器參考手冊](/jquery/jquery_ref_selectors.asp "jQuery 參考手冊 - 選擇器")。