jQuery類選擇器不起作用，而id選擇器僅適用於“ body”

Question

我正在嘗試通過jquery應用CSS值，但由於某些原因，類選擇器或id選擇器無法正常工作。

這是我的小提琴：

如您所見，如果我使用id =“ kitten”，則什么也不會發生。

HTML

    <div id="kitten"></div>

腳本

    $(function(){
    var x = 0;
    setInterval(function(){
        x-=1;
        $("kitten").css("background-position", x + "px 0");
    }, 10);
});

CSS

    html, body { height: 100%; width: 100%;}
    #kitten {
    background-image: url("http://sereedmedia.com/srmwp/wp-content/upload/kitten.jpg");
    background-repeat: repeat-x;
    }

這是行不通的。 但是，如果我使用“ body”而不是id-一切都開始工作。

擺弄“身體”

為什么我不能使用jQuery id選擇器或類選擇器？

Answer 1

要引用一個ID，就像在CSS中一樣，您需要在ID本身之前使用哈希。 正確的代碼是：

$("#kitten").css("background-position", x + "px 0");

Answer 2

 $("kitten").css("background-position", x + "px 0");

這條線是錯誤的..

這個會成功的

 $("#kitten").css("background-position", x + "px 0");

您需要為ID選擇器輸入正確的字符串文字，請在此處進行檢查。

Answer 3

首先，您需要執行以下操作：

$("#kitten").css("background-position", x + "px 0");

因為您沒有獲得Id選擇器。

並為div定義寬度和高度，以顯示圖像，如下所示：

#kitten {
    background-image: url("http://sereedmedia.com/srmwp/wp-content/uploads/kitten.jpg");
    background-repeat: repeat-x;
    width: 390px; <----- LIKE this
    height: 200px; <----- LIKE this
}

DEMO

Answer 4

ID選擇器以#開頭：

$("#kitten").css("background-position", x + "px 0");

類選擇器的前綴為. ，例如，如果kitten是一類：

$(".kitten").css("background-position", x + "px 0");

使用body選擇器時，將使用沒有前綴的標簽選擇器。

$("input"); //selects all input tags

對於大多數基本選擇器，只需遵循CSS選擇器語法。

Answer 5

您的選擇器缺少用於按ID選擇標簽的＃：

$("#kitten")