JavaScript和jQuery之间的背景颜色值

Question

我试图在点击时获取彩色框的背景颜色，然后使用JavaScript或jQuery将其存储在变量中。虽然获取这些信息是微不足道的，但我注意到的是，JavaScript和jQuery以稍微不同的方式显示它。

例如，我使用的彩色框是红色的（在CSS中，我给的是背景颜色：红色）。因此，当我使用JavaScript中的以下代码单击带有id（#box）的框时

var bColour = document.getElementById("box").style.backgroundColor;

console.log(bColour)给我的值为red。

而jQuery中的相同

var bColour = $(#box).css("background-color");

console.log(bColour)给我的值为rgb(255, 0, 0)。

jQuery是否有办法显示与JavaScript显示的bColour值相同的值？

Answer 1

jQuery.css使用getComputedStyle功能。的 ref

getComputedStyle(Object).getPropertyValue(Property)和jQuery.css

之间没有区别

例如

document.getElementById("myDiv").style.backgroundColor
// return red;

getComputedStyle(document.getElementById("myDiv")).getPropertyValue("background-color");
// return rgb(255, 0, 0);

$('#myDiv').css("backgroundColor")
// return rgb(255, 0, 0);