Bagaimana untuk Mengesan Penambahan Unsur dalam DOM: Penamatan dan Alternatif?

Memerhati Penambahan Elemen dalam DOM

Untuk menerima pemberitahuan apabila elemen ditambahkan pada halaman web, beberapa pendekatan tersedia:

Peristiwa Mutasi Ditamatkan:

Sebelum ini, peristiwa mutasi (cth., DOMNodeInserted) boleh digunakan untuk memantau perubahan DOM. Walau bagaimanapun, peristiwa ini kini telah ditamatkan.

Pengundian Berterusan:

Pendekatan lapuk melibatkan penggunaan setInterval() untuk sentiasa menyemak kehadiran elemen yang diingini:

<code class="js">function checkDOMChange() {
  // Check for element presence...

  // Continue polling after 100 milliseconds
  setTimeout(checkDOMChange, 100);
}</code>

Ini ialah penyelesaian yang tidak cekap yang menggunakan sumber CPU yang ketara.

Disyorkan: MutationObserver

Pelayar moden menyokong MutationObserver, yang menyediakan alternatif kepada mutasi peristiwa. Ia membolehkan anda memerhati perubahan DOM dan melaksanakan fungsi panggil balik apabila elemen ditambahkan:

<code class="js">const observer = new MutationObserver(mutations => {
  // Process DOM changes...
});

observer.observe(document.documentElement, { childList: true });</code>

Dengan melaksanakan MutationObserver, anda boleh memantau penambahan DOM dengan berkesan tanpa had peristiwa mutasi yang ditamatkan atau ketidakcekapan pengundian berterusan .

Atas ialah kandungan terperinci Bagaimana untuk Mengesan Penambahan Unsur dalam DOM: Penamatan dan Alternatif?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!