Question

我是jquery的新手，我有点惊讶：写

$('#selected-color').css('background-color', 'rgba(0,0,0,1)');

我最终的风格#selected-color最终是rgb(0,0,0)。当我取回背景色并尝试对其应用正则表达式时，这会产生很大的不同，期望得到一个rgba字符串。

所以问题是当alpha设置为1时，jQuery是否对rgba值应用自动转换？我在a = 1.0时得到了相同的结果，但是得到了a = 0.99的RGBA。 jQuery文档中对此没有成功的提示

Answer 1

这不是jQuery功能。在rgb时，所有颜色表达式都被评估为alpha = 1表达式，在rgba时，所有颜色表达式都被评估为alpha < 1表达式。

来自MDN Documentation：

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

在CSS3 SPEC中：

计算值：


基本颜色关键字，RGB十六进制值和扩展颜色关键字的计算值是RGB数值的等效三元组，例如六位十六进制值或rgb（...）功能值，alpha值为1。


关键字“透明”的计算值是所有零RGBA数值的四元组，例如rgba（0,0,0,0）。

对于所有其他值，计算得出的值为指定值。

示例：

var
  foo = document.getElementById("foo"),
  getBGColor = function () {
    return getComputedStyle(foo, null).backgroundColor;
  };

/* Setting the background with an alpha value of 1. */
foo.style.backgroundColor = "rgba(0, 0, 0, 1)";
console.log("alpha = 1: ", getBGColor());

/* Setting the background with a hex number. */
foo.style.backgroundColor = "#000";
console.log("alpha = 1: ", getBGColor());

/* Setting the background with a hsl expression. */
foo.style.backgroundColor = "hsl(120, 100%, 25%)";
console.log("alpha = 1: ", getBGColor());

/* Setting the background with an alpha value less than 1. */
foo.style.backgroundColor = "rgba(0, 0, 0, .5)";
console.log("alpha < 1: ", getBGColor());

/* Setting the background with a hsla expression. */
foo.style.backgroundColor = "hsla(120, 100%, 25%, .5)";
console.log("alpha < 1: ", getBGColor());

<div id = "foo"></div>

是jQuery自动将RGBA转换为RGB？

1 个答案: