如何使用jquery检查类的背景颜色?

I have set the background color of a class using css, now I want to put it in a variable using jquery. Thanks

我已经使用css设置了一个类的背景色，现在我想使用jquery将它放到一个变量中。谢谢

4 个解决方案

#1

You may have to apply that class to a temporary element, and then extract the bgcolor of that element.

您可能需要将该类应用到临时元素，然后提取该元素的bgcolor。

.cm { background-color:#990000 }

- - -

// creating an empty element and applying our class to it
var bgcolor = $("<div>").appendTo("body").addClass("cm").css("background-color");
alert(bgcolor); // rgb(153, 0, 0)

#2

If there is an element on the page using that class, you can do something like:

如果页面上有使用该类的元素，您可以执行以下操作:

var backgroundColor = $('.classname').css('background-color');

var写成backgroundColor = $(' .classname '). css(“背景颜色”);

But if nothing is using the class, I'm not familiar with any way to grab the color save from loading the .css file and parsing it in JavaScript (less than ideal).

但是，如果没有使用这个类，我不熟悉如何从加载.css文件并使用JavaScript解析保存颜色(不太理想)。

#3

The problem is that jquery can't traverse the actual stylesheet (as far as I know), so if you have an element with two classes, you would have no way of knowing whether the color it returned was for the class you wanted or the other one. For instance:

问题是jquery不能遍历实际的样式表(据我所知)，所以如果您有一个元素有两个类，您将无法知道它返回的颜色是针对您想要的类还是针对另一个类。例如:

.big { background-color: yellow; }

background - color .big {:黄色;}

.mean { background-color: blue; }

.mean {背景颜色:蓝色;}

The first one would be blue, but if you request the background color using:

第一个是蓝色的，但是如果你要求使用背景色:

 $(".big").css("background-color");

You would get blue, even though that class is set to yellow, since the first element is technically of the class big but it has a blue background.

你会得到蓝色，即使类被设置为黄色，因为第一个元素在技术上是类big，但是它有蓝色的背景。

I like Jonathan Sampson's idea. Create an element, make it invisible or offscreen, but give it an ID and the class you are wondering about. Then check the background color of that ID instead of checking by class:

我喜欢乔纳森·桑普森的主意。创建一个元素，使它不可见或不在屏幕上，但是给它一个ID和您想要的类。然后检查该ID的背景颜色，而不是按类检查:

 $("#colortest").css("background-color");

#4

var $tmp = $('<a class="classname"></a>');
$('body').append($tmp).hide();
var color = $('.classname').css('background-color');
$tmp.remove();

EDIT: Applies the class to a hidden element.

编辑:将类应用到隐藏元素。

#1