jquery是不是只能用id選擇器

發(fā)布時間：2022-04-21 10:07:29 來源：億速云閱讀：179 作者：zzz 欄目：web開發(fā)

這篇文章主要介紹了jquery是不是只能用id選擇器的相關(guān)知識，內(nèi)容詳細(xì)易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇jquery是不是只能用id選擇器文章都會有所收獲，下面我們一起來看看吧。

jquery不是只能用id選擇器。jquery提供了多種選擇器：1、class選擇器，可通過指定class查找元素；2、標(biāo)簽選擇器，可通過html標(biāo)簽名選擇元素；3、屬性選擇器，用XPath表達式來選擇帶有指定屬性的元素；4、群組選擇器等。

本教程操作環(huán)境：windows10系統(tǒng)、jquery3.2.1版本、Dell G3電腦。

jquery只能用id選擇器嗎

jQuery 選擇器允許您對 HTML 元素組或單個元素進行操作。

jQuery 選擇器基于元素的 id、類、類型、屬性、屬性值等"查找"（或選擇）HTML 元素。它基于已經(jīng)存在的 CSS 選擇器，除此之外，它還有一些自定義的選擇器。

jQuery 中所有選擇器都以美元符號開頭：$()。

jQuery 元素選擇器

jQuery 使用 CSS 選擇器來選取 HTML 元素。

$("p") 選取 <p> 元素。

$("p.intro") 選取所有 class="intro" 的 <p> 元素。

$("p#demo") 選取所有 id="demo" 的 <p> 元素。

jQuery 屬性選擇器

jQuery 使用 XPath 表達式來選擇帶有給定屬性的元素。

$("[href]") 選取所有帶有 href 屬性的元素。

$("[href='#']") 選取所有帶有 href 值等于 "#" 的元素。

$("[href!='#']") 選取所有帶有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 選取所有 href 值以 ".jpg" 結(jié)尾的元素。

#id 選擇器

jQuery #id 選擇器通過 HTML 元素的 id 屬性選取指定的元素。

頁面中元素的 id 應(yīng)該是唯一的，所以您要在頁面中選取唯一的元素需要通過 #id 選擇器。

通過 id 選取元素語法如下：

$("#test")

示例如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>123</title> 
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#test").hide();
  });
});
</script>
</head>
<body>
<h3>這是一個標(biāo)題</h3>
<p>這是一個段落</p>
<p id="test">這是另外一個段落</p>
<button>點我</button>
</body>
</html>

輸出結(jié)果：

jquery是不是只能用id選擇器

.class 選擇器

jQuery 類選擇器可以通過指定的 class 查找元素。

語法如下：

$(".test")

示例如下：

<script>
$(document).ready(function(){
  $("button").click(function(){
    $(".test").hide();
  });
});
</script>
</head>
<body>
<h3 class="test">這是一個標(biāo)題</h3>
<p class="test">這是一個段落。</p>
<p>這是另外一個段落。</p>
<button>點我</button>

輸出結(jié)果：

jquery是不是只能用id選擇器

群組選擇器

群組選擇器，用于同時對幾個選擇器進行相同的操作。

語法：

$("選擇器1, 選擇器2, ... , 選擇器n")

兩個選擇器之間必須用英文逗號,隔開，否則該選擇器無法生效。

舉例

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="js/jquery-1.12.4.min.js"></script>
    <script>
        $(function () {
            $("h4,div,p,span").css("color","red");
        })
    </script>
</head>
<body>
    <h4>中文網(wǎng)</h4>
    <div>中文網(wǎng)</div>
    <p>中文網(wǎng)</p>
    <span>中文網(wǎng)</span>
</body>
</html>

關(guān)于“jquery是不是只能用id選擇器”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對“jquery是不是只能用id選擇器”知識都有一定的了解，大家如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

jquery是不是只能用id選擇器

jquery只能用id選擇器嗎

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽