Bagaimana untuk Mendapatkan Saiz Fon Dikira Elemen DOM dalam JavaScript?

Cara Mengambil Saiz Fon Dikira dalam JavaScript

Menentukan saiz fon sebenar elemen DOM adalah penting dalam pelbagai senario, seperti menyesuaikan penyunting teks atau mereka bentuk reka letak web responsif. Ini melibatkan mempertimbangkan bukan sahaja gaya eksplisit elemen tetapi juga nilai yang diwarisi dan tetapan peringkat penyemak imbas.

Penyelesaian

Untuk mendapatkan saiz fon yang dikira, anda boleh memanfaatkan dua kaedah :

1. Kaedah Khusus Pelayar: currentStyle

Untuk Internet Explorer, anda boleh menggunakan sifat currentStyle bukan standard:

element.currentStyle['fontSize']

Perhatikan bahawa nama sifat yang mengandungi tanda sempang, seperti saiz fon, mesti diakses dalam camelCase (cth., FontSize) untuk Gaya semasa.

2. Kaedah Standard: getComputedStyle

Untuk semua penyemak imbas lain dan keserasian merentas penyemak imbas, anda boleh menggunakan kaedah getComputedStyle standard DOM Tahap 2:

document.defaultView.getComputedStyle(element, null).getPropertyValue('fontSize')

Contoh Pelaksanaan

Tentukan fungsi utiliti untuk mengambil gaya:

function getStyle(element, styleProp) {
  var camelize = function (str) {
    return str.replace(/\-(\w)/g, function(str, letter){
      return letter.toUpperCase();
    });
  };
  
  if (element.currentStyle) {
    return element.currentStyle[camelize(styleProp)];
  } else if (document.defaultView && document.defaultView.getComputedStyle) {
    return document.defaultView.getComputedStyle(element,null)
                               .getPropertyValue(styleProp);
  } else {
    return element.style[camelize(styleProp)]; 
  }
}

Penggunaan:

var element = document.getElementById('elementId');
getStyle(element, 'font-size');

Petua Tambahan

• Periksa kewujudan document.defaultView sebelum mengakses getComputedStyle.
• Jika kedua-dua currentStyle dan getComputedStyle adalah tidak tersedia, gunakan element.style untuk mendapatkan semula sifat CSS sebaris.

Atas ialah kandungan terperinci Bagaimana untuk Mendapatkan Saiz Fon Dikira Elemen DOM dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!