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 - 表示不透明度）表示，而不是作为颜色名称（如红色，蓝色，橙色，透明等）或以十六进制表示值。根据{{3}}透明度表示为rgb(0, 0, 0)。

如果值是半透明的，则计算出的值将是rgba（）对应的值。如果不是，它将是rgb（）对应的一个。 transparent关键字映射到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/）

为什么jQuery .css（'background-color'）为'transparent'返回rgba（0,0,0,0）？

3 个答案: