Get the background color and font color of the Web page as follows:
Thought: By getting the color attribute is worth to the RGB color, not what we want, so you need to change the RGB color to hexadecimal color, first get RGB color:
Copy Code code as follows:
var RGB = document.getElementById (' color '). Style.backgroundcolor;
The resulting format is as follows: RGB (225, 22, 23); And then split the break:
Copy Code code as follows:
var RGB = Rgb.split (' (') [1];////[RGB, 225,22,23)] form, array of length 2
The (225,22,23) string is then split (note: Only the number type can be converted, so use parseint to cast the type!). ） ：
Copy Code code as follows:
for (var k = 0; k < 3; k++) {
Str[k] = parseint (RGB. Split (', ') [K]). toString;//str array Save split data
}
The final combination:
Copy Code code as follows:
str = ' # ' +str[0]+str[1]+str[2];
The entire code is as follows:
Copy Code code as follows:
<! DOCTYPE html>
<title>gethexcolor js/jquery get hexadecimal color </title>
<meta charset= "Utf-8"/>
<script type= "Text/javascript" >
function Gethexbgcolor () {
var str = [];
var RGB = document.getElementById (' color '). Style.backgroundColor.split (' (');
for (var k = 0; k < 3; k++) {
Str[k] = parseint (Rgb[1].split (', ') [K]). toString (16);
}
str = ' # ' +str[0]+str[1]+str[2];
document.getElementById (' Color '). InnerHTML = str;
}
function Gethexcolor () {
var str = [];
var RGB = document.getElementById (' color '). Style.color.split (' (');
for (var k = 0; k < 3; k++) {
Str[k] = parseint (Rgb[1].split (', ') [K]). toString (16);
}
str = ' # ' +str[0]+str[1]+str[2];
document.getElementById (' Color '). InnerHTML = str;
}
</script>
<style type= "Text/css" >
#color {
width:200px;
height:200px;
line-height:200px;
Text-align:center;
}
</style>
<body>
<div style= "color: #88ee22; Background-color: #ef8989; "id=" Color "></div>
<input onclick= "Gethexbgcolor ();" type= button "value=" Get background color "/>
<input onclick= "Gethexcolor ();" type= button "value=" Get font Color "/>
</body>
