如何使用 attr 获取样式值答案

【问题标题】：How to get the style value using attr如何使用 attr 获取样式值
【发布时间】：2013-05-09 02:03:27
【问题描述】：

我的 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 中，它不会工作。我怎样才能完成这项任务？

【问题讨论】：

【解决方案1】：

Demo

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

【讨论】：

【解决方案2】：

这就是你要找的东西（这段代码有效）：

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

但是，您应该使用css，而不是使用attr，因此代码将是：

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

【讨论】：

【解决方案3】：

您可以使用$("#bgcolor").css("backgroundColor");获取颜色。

【讨论】：

【解决方案4】：

我相信这应该可以解决问题，替换你的

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

有

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

这应该将样式更改为另一个对象上的样式。

【讨论】：

【解决方案5】：

查看 .css 的文档：http://api.jquery.com/css/

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

【讨论】：

我错了，还是background-color？
@Andreas:it doesn't matter，它们在 jQuery 下都是有效/等效的。
@AndreasNiedermair 来自文档：“另外，jQuery 可以平等地解释多词属性的 CSS 和 DOM 格式。例如，jQuery 理解并返回正确的值 .css( {'background-color': '#ffe', 'border-left': '5px solid #ccc'}) 和 .css({backgroundColor: '#ffe', borderLeft: '5px solid #ccc'})。注意如果使用 DOM 表示法，属性名称周围的引号是可选的，但对于 CSS 表示法，由于名称中的连字符，它们是必需的。"
这就是我想要的答案。谢谢@dwaddell。
有什么更好的事件可以用颜色选择器代替 mouseleave 吗？