How to Use jQuery to obtain the color values in CSS styles in different browser formats

JQuery solves the problem of getting the color values in CSS styles in different browser formats, for more information about how to use jQuery to obtain the value of background-color in a 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:

The 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:

The 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;
}