Bagaimanakah Saya Boleh Mengesan Limpahan Kandungan Elemen HTML Secara Pengaturcaraan Tanpa Bar Skrol?

Mengesan Limpahan Kandungan Elemen HTML Tanpa Bar Skrol

Mengetahui jika kandungan elemen HTML melebihi hadnya boleh menjadi penting untuk pelbagai senario. Walau bagaimanapun, menyemak limpahan boleh menjadi rumit, terutamanya apabila sifat limpahan elemen ditetapkan kepada "kelihatan" dan tidak mempunyai bar skrol.

Untuk mengatasi cabaran ini, kami boleh memanfaatkan JavaScript untuk menentukan limpahan. Satu pendekatan biasa ialah membandingkan klien elemen [Lebar/Tinggi] dengan tatal [Lebar/Tinggi]. Walau bagaimanapun, apabila limpahan ditetapkan kepada "kelihatan", nilai ini menjadi sama, menghalang pengesanan tepat.

Mengesan Limpahan Secara Program

Untuk mengambil kira keanehan ini, kami boleh menggunakan rutin pengesanan yang mengubah suai gaya "limpahan" elemen buat sementara waktu:

// Determines if the passed element is overflowing its bounds,
// either vertically or horizontally.
// Will temporarily modify the "overflow" style to detect this
// if necessary.
function checkOverflow(el) {
  var curOverflow = el.style.overflow;

  if (!curOverflow || curOverflow === "visible") {
    el.style.overflow = "hidden";
  }

  var isOverflowing = el.clientWidth < el.scrollWidth || el.clientHeight < el.scrollHeight;

  el.style.overflow = curOverflow;

  return isOverflowing;
}

The fungsi checkOverflow:

1. Menyimpan nilai sifat limpahan semasa dalam curOverflow.
2. Menetapkan limpahan kepada "tersembunyi" (tanpa bar skrol) jika ia tidak ditetapkan atau "kelihatan". Ini memastikan pengesanan limpahan yang tepat.
3. Membandingkan dimensi klien elemen (clientWidth, clientHeight) dengan dimensi skrolnya (scrollWidth, scrollHeight). Jika mana-mana dimensi ini lebih kecil, ia menunjukkan limpahan.
4. Menetapkan semula sifat limpahan kepada nilai asalnya.
5. Mengembalikan hasil boolean isOverflowing.

Rutin ini telah diuji dalam pelayar utama seperti Firefox, Internet Explorer dan Chrome, menyediakan pengesanan limpahan yang boleh dipercayai tanpa mengira tetapan limpahan atau kehadiran bar skrol.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengesan Limpahan Kandungan Elemen HTML Secara Pengaturcaraan Tanpa Bar Skrol?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!