Bagaimanakah Saya Boleh Mendapatkan Warna Latar Belakang Elemen Web sebagai Kod Heksadesimal Menggunakan JavaScript?-tutorial css-php.cn

How Can I Get a Web Element's Background Color as a Hexadecimal Code Using JavaScript?

Mendapatkan Kod Warna Heksadesimal untuk Latar Belakang Elemen

Apabila bekerja dengan elemen web, keupayaan untuk mendapatkan semula kod warna latar belakang dalam format perenambelasan berguna untuk pelbagai gaya dan tujuan reka bentuk. Soalan ini menyelidiki keperluan pengguna untuk memperoleh kod warna latar belakang elemen yang menggunakan JavaScript dan CSS.

Pelaksanaan Kod

Untuk mendapatkan kod warna latar belakang, seseorang boleh menggunakan fungsi css() JavaScript . Contohnya, jika anda ingin mendapatkan semula kod warna latar belakang

elemen dengan nama kelas "div", coretan kod berikut boleh digunakan:

console.log($(".div").css("background-color"));

Salin selepas log masuk

Kod ini menggunakan perpustakaan jQuery untuk mengakses elemen dan fungsi css() kemudiannya digunakan untuk mendapatkan semula nilai untuk sifat "warna latar belakang". Kod warna latar belakang yang terhasil dalam format perenambelasan akan dilog ke konsol.

Fungsi Tersuai untuk Penukaran Heksadesimal

Sebagai alternatif, fungsi JavaScript tersuai boleh ditakrifkan untuk menukar nilai warna yang diambil daripada css () berfungsi ke dalam format perenambelasan. Berikut ialah contoh:

var color = '';
$('div').click(function() {
  var x = $(this).css('backgroundColor');
  hexc(x);
  console.log(color);
})

function hexc(colorval) {
  var parts = colorval.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
  delete(parts[0]);
  for (var i = 1; i <= 3; ++i) {
    parts[i] = parseInt(parts[i]).toString(16);
    if (parts[i].length == 1) parts[i] = '0' + parts[i];
  }
  color = '#' + parts.join('');
}

Salin selepas log masuk

Dalam contoh ini, fungsi hexc() mengambil nilai warna RGB sebagai input dan menukarkannya kepada format heksadesimal. Fungsi ini digunakan apabila

elemen diklik. Kod warna heksadesimal yang terhasil disimpan dalam pembolehubah warna dan dilog ke konsol.

Sumber Tambahan

Untuk demonstrasi praktikal, rujuk pautan contoh kod yang disediakan dalam soalan asal. Klik pada elemen div untuk mendapatkan semula nilai warna latar belakangnya dalam format perenambelasan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mendapatkan Warna Latar Belakang Elemen Web sebagai Kod Heksadesimal Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimana Membuat Bentuk Bulatan Songsang atau Potongan Menggunakan CSS? Artikel seterusnya：Bagaimana untuk Menghapuskan Isu Ruang Putih dan Tatal dengan Kanvas dalam Bekas Div?

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang