Bagaimanakah Saya Boleh Mengesan Limpahan Teks CSS Menggunakan JavaScript?

Mengesan Limpahan Teks dengan Elipsis

Sifat limpahan teks dalam CSS membenarkan teks dipotong apabila melebihi lebar bekasnya. Elipsis (...) kemudiannya dipaparkan untuk menunjukkan bahawa teks terputus.

Pengesanan Limpahan

Untuk mengesan unsur mana pada halaman web yang teksnya dipotong , anda boleh menggunakan JavaScript:

function isEllipsisActive(e) {
    return (e.offsetWidth < e.scrollWidth);
}

Fungsi ini mengambil elemen sebagai input dan mengembalikan benar jika lebarnya kurang daripada skrolnya lebar, menunjukkan bahawa teksnya melimpah.

Contoh Penggunaan

Anda boleh menggunakan fungsi ini untuk menyemak status limpahan unsur, seperti yang berikut:

<div>
  <span>Normal text</span>
</div>
<div>
  <span>Long text that will be trimmed text</span>
</div>

console.log(isEllipsisActive(document.querySelector('span'))); // false (for the first div)
console.log(isEllipsisActive(document.querySelectorAll('span')[1])); // true (for the second div)

Dengan menggunakan fungsi JavaScript ini, anda boleh mengesan unsur secara dinamik dengan teks yang melimpah dan menggunakan penggayaan yang sesuai atau tingkah laku yang sewajarnya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengesan Limpahan Teks CSS Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!