Pour obtenir la couleur d'arrière-plan et la couleur de la police de la page Web, la méthode est la suivante:
Pensée: Ce qui est digne d'obtenir l'attribut de couleur, c'est la couleur RVB, ce qui n'est pas ce que nous voulons, nous devons donc changer la couleur RVB en couleur hexadécimale, et d'abord obtenir la couleur RVB:
La copie de code est la suivante:
var rgb = document.getElementById ('couleur'). style.backgroundColor;
Le format est obtenu comme suit: RGB (225, 22, 23);
La copie de code est la suivante:
var rgb = rgb.split ('(') [1]; // tableau avec la longueur 2 après le fractionnement
Puis divisez la chaîne (225, 22, 23) (Remarque: seul le type de nombre peut être converti, alors utilisez ParseInt pour lancer le type!):
La copie de code est la suivante:
pour (var k = 0; k <3; k ++) {
str [k] = parseInt (rgb .split (',') [k]).
}
La combinaison finale:
La copie de code est la suivante:
str = '#' + str [0] + str [1] + str [2];
L'ensemble du code est le suivant:
La copie de code est la suivante:
<! Doctype html>
<html>
<adal>
<Title> Gethexcolor JS / JQuery Get Hex Color </Title>
<meta charset = "utf-8" />
<script type = "text / javascript">
fonction gethexbgcolor () {
var str = [];
var rgb = document.getElementById ('couleur'). style.backgroundColor.split ('(');
pour (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;
}
fonction gethexcolor () {
var str = [];
var rgb = document.getElementById ('couleur'). style.color.split ('(');
pour (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;
}
</cript>
<style type = "text / css">
#couleur{
Largeur: 200px;
hauteur: 200px;
Heure de ligne: 200px;
Texte-aligne: Centre;
}
</ style>
</ head>
<body>
<div style = "Color: # 88EE22; Background-Color: # ef8989;"
<entrée onClick = "GethexBgColor ();"
<entrée onclick = "gethexcolor ();"
</docy>
</html>