Bagaimana untuk Mengesan Perubahan dalam Sifat CSS dengan jQuery?

Pengesanan Acara Mutasi untuk Perubahan Harta CSS dengan jQuery

Keperluan untuk mengesan perubahan dalam sifat CSS sering timbul dalam pembangunan web. Sebagai contoh, anda mungkin mahu melaksanakan tindakan tertentu apabila sifat paparan elemen diubah. Walau bagaimanapun, menentukan sama ada sifat paparan atau mana-mana sifat CSS lain telah berubah secara asli dalam jQuery boleh menjadi satu cabaran.

Menyemak Perubahan Harta CSS dengan DOMAttrModified

Mujurlah, Modul Acara Tahap 2 DOM menangani keperluan ini dengan peristiwa mutasi. Satu peristiwa sedemikian, DOMAttrModified, menyediakan keupayaan untuk memantau perubahan atribut, termasuk perubahan gaya.

Untuk menggunakan DOMAttrModified, anda boleh melaksanakan kod berikut:

<code class="js">document.documentElement.addEventListener('DOMAttrModified', function(e) {
  if (e.attrName === 'style') {
    console.log('prevValue: ' + e.prevValue, 'newValue: ' + e.newValue);
  }
}, false);

document.documentElement.style.display = 'block';</code>

Kod ini melampirkan pendengar kepada elemen akar (document.documentElement) untuk acara DOMAttrModified. Apabila atribut gaya berubah, pendengar menangkap nilai sebelumnya dan baharu.

Alternatif untuk Internet Explorer: propertychange

Jika anda perlu menyokong penyemak imbas Internet Explorer, anda boleh gunakan acara "propertychange" sebagai sandaran kepada DOMAttrModified. Ia membolehkan pengesanan perubahan gaya yang boleh dipercayai dalam IE.

Nota:

Adalah penting untuk ambil perhatian bahawa peristiwa mutasi telah ditamatkan dan mungkin tidak disokong oleh semua penyemak imbas. Untuk penyelesaian yang lebih serasi merentas penyemak imbas, pertimbangkan untuk menggunakan pemerhati mutasi.

Atas ialah kandungan terperinci Bagaimana untuk Mengesan Perubahan dalam Sifat CSS dengan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!