Untuk mendapatkan warna latar belakang dan warna font dari halaman web, metode ini adalah sebagai berikut:
Pikiran: Apa yang layak mendapatkan atribut warna adalah warna RGB, yang bukan yang kita inginkan, jadi kita perlu mengubah warna RGB menjadi warna heksadesimal, dan pertama -tama dapatkan warna RGB:
Salinan kode adalah sebagai berikut:
var rgb = document.geteLementById ('color'). style.backgroundColor;
Format diperoleh sebagai berikut: RGB (225, 22, 23);
Salinan kode adalah sebagai berikut:
var rgb = rgb.split ('(') [1]; // array dengan panjang 2 setelah pemisahan
Kemudian belah string (225, 22, 23) (Catatan: Hanya jenis angka yang dapat dikonversi, jadi gunakan ParseInt untuk melemparkan tipe!):
Salinan kode adalah sebagai berikut:
untuk (var k = 0; k <3; k ++) {
str [k] = parseInt (rgb .split (',') [k]). tostring (16); // str Array menyimpan data split
}
Kombinasi terakhir:
Salinan kode adalah sebagai berikut:
str = '#'+str [0]+str [1]+str [2];
Seluruh kode adalah sebagai berikut:
Salinan kode adalah sebagai berikut:
<! Doctype html>
<Html>
<head>
<title> getHexcolor JS/jQuery mendapatkan warna hex </iteme>
<meta charset = "UTF-8" />
<type skrip = "Teks/JavaScript">
fungsi getHexBgColor () {
var str = [];
var rgb = document.geteLementById ('color'). style.backgroundColor.split ('(');
untuk (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;
}
fungsi getHexColor () {
var str = [];
var rgb = document.geteLementById ('color'). style.color.split ('(');
untuk (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>
<type style = "text/css">
#warna{
Lebar: 200px;
Tinggi: 200px;
Line-Height: 200px;
Teks-Align: tengah;
}
</tyle>
</head>
<body>
<div style = "Color: #88EE22; latar belakang-warna: #EF8989;"
<Input OnClick = "GetHexBGColor ();"
<Input OnClick = "GetHexColor ();"
</body>
</html>