How does jQuery obtain the color values in CSS Styles? Different browser formats

When jQuery is used to obtain the value of background-color in the style, the obtained color value is displayed in HEX format in IE10 or earlier versions [# ffff00], while IE10, chrome and Firefox display [rgb (255, 0, 0)] in GRB format. To determine the color value, you need to obtain a uniform color format, preferably in HEX format, easy to handle. Search for a piece of code from a foreign website:

Copy codeThe Code is as follows: $. fn. getHexBackgroundColor = function (){
Var rgb = background (this).css ('background-color ');
Rgb = rgb. match (/^ rgb \ (\ d +), \ s * (\ d +), \ s * (\ d +) \) $ /);
Function hex (x) {return ("0" + parseInt (x). toString (16). slice (-2 );}
Return rgb = "#" + hex (rgb [1]) + hex (rgb [2]) + hex (rgb [3]);
}

The above defines a jQuery function. We can use $ ("# bg"). getHexBackgroundColor (); to obtain the RGB value of background-color with the tag id = "bg.

The following is a small modification, that is, adding a judgment. If the HEX value is displayed (less than IE10), the value is taken directly. If it is not an IE browser, the value is converted to the RGB format:

Copy codeThe Code is as follows: $. fn. getBackgroundColor = function (){
Var rgb = background (this).css ('background-color ');
If (rgb> = 0) return rgb; // if it is a hex value, return directly
Else {
Rgb = rgb. match (/^ rgb \ (\ d +), \ s * (\ d +), \ s * (\ d +) \) $ /);
Function hex (x) {return ("0" + parseInt (x). toString (16). slice (-2 );}
Rgb = "#" + hex (rgb [1]) + hex (rgb [2]) + hex (rgb [3]);
}
Return rgb;
}