Bagaimanakah Saya Boleh Mendapatkan Muka dan Saiz Fon yang Dirender dalam JavaScript?

Menyingkap Fon yang Dirender: Mengakses Muka dan Saiz Fon Sebenar

Dalam bidang pembangunan web, selalunya perlu untuk mendapatkan semula muka dan saiz fon sebenar sesuatu elemen, terutamanya apabila berurusan dengan kandungan yang dijana secara dinamik atau situasi di mana gaya CSS tidak ditakrifkan secara eksplisit. Tugas ini boleh terbukti mencabar kerana pendekatan konvensional JavaScript untuk mengakses sifat gaya, seperti object.style.fontFamily, tidak memberikan hasil.

Jangan takut, kerana terdapat penyelesaian yang memberikan JavaScript kuasa untuk mendedahkan fon yang diberikan sifat-sifat. Kaedah getComputedStyle memegang kunci untuk mengakses gaya yang dikira, termasuk sifat berkaitan fon yang kami cari.

Berikut ialah fungsi JavaScript yang memanfaatkan kaedah getComputedStyle:

function css(element, property) {
  return window.getComputedStyle(element, null).getPropertyValue(property);
}

Untuk menggunakan fungsi ini dan dapatkan semula, katakan, saiz fon elemen, hanya panggil css(objek, 'saiz fon'). Ini akan mengembalikan nilai seperti '16px', yang mewakili saiz fon yang diberikan sebenar.

Perlu diingat bahawa getComputedStyle tidak disokong oleh IE8. Selain itu, fon yang dikira mungkin tidak sentiasa sejajar dengan fon yang diingini yang ditakrifkan dalam CSS disebabkan oleh lalai sistem atau penggantian penyemak imbas. Namun begitu, fungsi ini menyediakan cara yang boleh dipercayai untuk mendapatkan semula atribut fon yang diberikan sebenar, memperkasakan pembangun dengan kawalan yang lebih besar ke atas persembahan visual halaman web mereka.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mendapatkan Muka dan Saiz Fon yang Dirender dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!