为什么 jQuery .css('background-color') 返回 rgba(0,0,0,0) 表示 'transparent'？

Question

我在这里有一个框-http://jsfiddle.net/U68p3/2/-背景透明。当我用jQuery的.css（"background-color"）读取背景时，它返回

               rgba(0, 0, 0, 0) 

如果我的代码正在寻找与"transparent"匹配的内容，这将没有多大帮助。

jQuery为什么要这样做？有没有办法让它返回"透明"？

谢谢。

$(function() {
    var bkgnd = $('#box').css('background-color');
    console.log('background-color is ' + bkgnd);
});

Answer 1

它不是jquery，颜色的计算值以RGBa（红色、蓝色、绿色、Alpha-表示不透明度）表示，而不是以颜色名称（如红色、蓝色，橙色、透明等）或十六进制值表示。根据规范，透明度表示为rgb(0, 0, 0)。

如果该值是半透明的，则计算出的值将是rgba（）对应的值。如果不是，它将是rgb（）对应的一个。透明关键字映射到rgb（0,0,0）。

因此，您可以添加一个特定的css规则来包括透明度，并将该类添加到元素中，然后使用该类的.hasClass或.is来检查元素是否透明，而不是查找这个特定的值。

似乎不同的浏览器以不同的方式表示它，IE、FF给出的值为transparency，所以无论如何，最好不要依赖这种值表示来进行任何逻辑。

Answer 2

它不是jQuery。jQuery返回浏览器为计算值提供的内容（例如，来自getComputedStyle或currentStyle）。浏览器提供的内容可以是浏览器想要使用的任何符号形式。在这种情况下，您正在测试的浏览器使用rgba（红色、绿色、蓝色、"alpha"，例如不透明度，0=透明），这是一个很好的表示法。其他浏览器可能只使用rgb甚至十六进制颜色字符串，这将是不幸的，因为这两种颜色字符串都不能正确表示transparent。

Answer 3

您将无法直接从jQuery中获得颜色作为名称。

您可以使用插件jQuery Color(https://github.com/jquery/jquery-color)将值转换为其名称，或者手动执行类似操作。

使用jsFiddle 的示例

$(function() {
  var bkgnd = $('#box').css('background-color');
  console.log('background-color is ' + jQuery.Color(bkgnd).toString());
});

(http://jsfiddle.net/Ap6qD/1/)