jQueryのcssメソッド【現役エンジニアが解説】

PROGRAM

今回は、jQueryのcssメソッドについて、簡単に解説していきます。

プロパティの取得

jQueryのcssメソッドでstyle属性を操作できます。

style属性のプロパティの値を取得するには、cssメソッドでプロパティ名を引数に指定します。

var color_property_value = $('#hoge').css('color');

上記のコードでは、hogeというidを持つ要素のstyle属性のcolorプロパティの値を取得しています。

プロパティの追加・変更

cssメソッドでプロパティの追加・変更も可能です。

第一引数にプロパティ名を、第二引数にその値を指定します。

$('#hoge').css('color', '#000');

上記の例では、hogeというidを持つ要素のcolorプロパティの値を#000に設定しています。

複数のプロパティの追加・変更

cssメソッドでは複数のプロパティの追加・変更もできます。

具体的には、引数に各プロパティの設定を記載したオブジェクトを指定します。

$('#hoge').css({'color':'#000', 'background-color':'#fff'});

上記のコードの例では、hogeというidを持つ要素のcolorプロパティの値を#000に、background-colorプロパティの値を#fffに設定しています。