web-dev-qa-db-ja.com

attrを使用してスタイル値を取得する方法

ここに私のHTMLコード:

 <i id="bgcolor" style="background-color: rgb(255, 146, 180)"></i>

Jquery attrを使用して背景色の値を取得したいと思います。私が試したのは以下です:

$("#bgcolor").mouseleave(function(){
        var bodyColor = $(this).attr("style");

        $("body").css(bodyColor);
    });

しかし、この出力は次のとおりです。

background-color: rgb(255, 146, 180);

そして、私はそれを私のcssに追加したので、それは機能しません。どうすればこのタスクを達成できますか?

enter image description here

12
Dilini Wasana

.cssのドキュメントを確認してください: http://api.jquery.com/css/

var bodyColor = $(this).css("backgroundColor");
19
dwaddell

これはあなたが探しているものです(このコードは機能します):

$("#bgcolor").mouseleave(function(){
    var bodyColor = $(this).attr("style");
    $("body").attr("style", bodyColor);
});

ただし、attrを使用する代わりにcssを使用する必要があるため、コードは次のようになります。

$("#bgcolor").mouseleave(function(){
    var bodyColor = $(this).css("background-color");
    $("body").css("background-color", bodyColor);
});

JSFiddle

2

これでうまくいくはずだと思います。

$("body").css(bodyColor);

$("body").attr('style', $(this).attr("style"));

これにより、スタイルが他のオブジェクトのスタイルに変更されます。

1
Cam

$("#bgcolor").css("backgroundColor");を使用して色を取得できます。

1
Klors

デモ

$("#bgcolor").mouseleave(function(){
    var bodyColor = $(this).css("background-color");
    $("body").css("background-color",bodyColor);
});
0
Rajender Joshi