jQuery CSS の変更が機能しないのはなぜですか?

jQuery を使用した CSS の変更

jQuery を使用して CSS を変更しようとすると、問題が発生する場合があります。一般的な問題のトラブルシューティングを行ってみましょう。

問題:

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor":"black","color":"white");
    $(".bordered").css("border", "1px solid black");
}

正しい構文に従っているにもかかわらず、コードが機能しません。

回答:

エラーの原因は次のとおりです。 $("#myParagraph").css() 行に右中括弧がありません。正しいコードは次のようになります。

$("#myParagraph").css({"backgroundColor": "black", "color": "white"});

この変更により、CSS 要素を正常に変更する機能する JavaScript 関数が生成されます。明確にするために、CSS プロパティ名の表記である「backgroundColor」と「background-color」は両方とも jQuery では有効です。 jQuery API ドキュメントでこれが確認されています。

ライブ デモは次のとおりです: http://jsfiddle.net/YPYz8/

完全な動作コード:

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor": "black", "color": "white"});
    $(".bordered").css("border", "1px solid black");
}

このコード スニペットは、h1 要素の背景色を、ID を持つ要素の背景色である黄色に変更する方法を示しています。 「myParagraph」を黒に、その要素のテキストの色を白にします。さらに、「bordered」クラスを持つすべての要素に 1 ピクセルの黒い境界線を追加します。

以上がjQuery CSS の変更が機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。