这是一种适用于所有使用 JQuery 的浏览器的方法：

1. <div id="dummy" style="display:none;"></div>在您的 HTML 页面上创建一个隐藏的 div 。（使用 JQuery 动态创建虚拟元素不适用于命名颜色）
2. 将虚拟元素的颜色设置为预期的颜色，即 $('#dummy').css('color','black');
3. 将虚拟元素的颜色与要检查的元素进行比较

IE

if($('#element').css('color') === $('#dummy').css('color')) {
  //do something
}

关于什么...

if ($('#element').css('color') == 'rgb(0, 0, 0)')
{
    // do something
}

将 0, 0, 0 替换为要比较的颜色值的红色、绿色和蓝色值。

.css() jQuery API

我有一个类似的问题，我不得不切换元素的 bgnd 颜色。我是这样解决的：

var color_one = "#FFA500";
var color_two = "#FFFF00";

function toggle_color(elem){
    var bgcolor = elem.css("background-color");
    elem.css("background-color", color_one);     // try new color
    if(bgcolor == elem.css("background-color"))  // check if color changed
        elem.css("background-color", color_two); // if here means our color was color_one
}

这是我在一个函数中实现 Mike 的答案。

function compareColors(left, right) {
    // Create a dummy element to assign colors to.
    var dummy = $('<div/>');

    // Set the color to the left color value, and read it back.
    $(dummy).css('color', left);
    var adjustedLeft = $(dummy).css('color');

    // Set the color to the right color value, and read it back.
    $(dummy).css('color', right);
    var adjustedRight = $(dummy).css('color');

    // Both colors are now adjusted to use the browser's internal format,
    // so we can compare them directly.
    return adjustedLeft == adjustedRight;
}

您无需实际将元素添加到 DOM 即可使其正常工作。在 IE8、IE10、FF、Chrome、Safari 中测试。

CSS 颜色可以以多种格式出现 - rgb、rgba、#hex、几乎不支持的#hexalpha、臭名昭著的命名颜色和特殊的transparent. 要将任何颜色与任何颜色进行比较，您需要先对它们进行标准化。在此处 (gist)或此处colorValues找到的函数(SO answer将始终为您提供数值数组。 然后您可以像这样比较它们：[r,g,b,a]

var sameColor = colorValues(color1).join(',') === colorValues(color2).join(',');

颜色值函数

// return array of [r,g,b,a] from any valid color. if failed returns undefined
function colorValues(color)
{
    if (color === '')
        return;
    if (color.toLowerCase() === 'transparent')
        return [0, 0, 0, 0];
    if (color[0] === '#')
    {
        if (color.length < 7)
        {
            // convert #RGB and #RGBA to #RRGGBB and #RRGGBBAA
            color = '#' + color[1] + color[1] + color[2] + color[2] + color[3] + color[3] + (color.length > 4 ? color[4] + color[4] : '');
        }
        return [parseInt(color.substr(1, 2), 16),
            parseInt(color.substr(3, 2), 16),
            parseInt(color.substr(5, 2), 16),
            color.length > 7 ? parseInt(color.substr(7, 2), 16)/255 : 1];
    }
    if (color.indexOf('rgb') === -1)
    {
        // convert named colors
        var temp_elem = document.body.appendChild(document.createElement('fictum')); // intentionally use unknown tag to lower chances of css rule override with !important
        var flag = 'rgb(1, 2, 3)'; // this flag tested on chrome 59, ff 53, ie9, ie10, ie11, edge 14
        temp_elem.style.color = flag;
        if (temp_elem.style.color !== flag)
            return; // color set failed - some monstrous css rule is probably taking over the color of our object
        temp_elem.style.color = color;
        if (temp_elem.style.color === flag || temp_elem.style.color === '')
            return; // color parse failed
        color = getComputedStyle(temp_elem).color;
        document.body.removeChild(temp_elem);
    }
    if (color.indexOf('rgb') === 0)
    {
        if (color.indexOf('rgba') === -1)
            color += ',1'; // convert 'rgb(R,G,B)' to 'rgb(R,G,B)A' which looks awful but will pass the regxep below
        return color.match(/[\.\d]+/g).map(function (a)
        {
            return +a
        });
    }
}