jQueryオブジェクト .css()

取得

CSS属性の値を取得する。

jQueryObject.css(name)

name

CSSプロパティの名前

設定

CSSプロパティに値を設定する。

jQueryObject.css(propertyName, value)

jQueryObject.css(object)

name

CSSプロパティの名前

value

CSSプロパティに設定する値

object

属性の名前と値のペアをオブジェクト形式で指定する。

$("#id").css({
  color: red,
  font-style: italic
});

使用例

css メソッドの使用例を以下に示す。

HTML

<p id="txt">The quick brown fox jumps over the lazy dog.</p>
<p>color: <span id="color"></span></p>
<button id="set">Set color property</button>
<button id="get">Get color property</button>
  

JavaScript

$("#set").click(function (){
  $("#txt").css("color", "red");
});

$("#get").click(function () {
  $("#color").html($("#txt").css("color"));
});

実行結果

The quick brown fox jumps over the lazy dog.

color:

参考文献

OpenJS Foundation (2022) .css() | jQuery API Documentation