Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Mengakses dan Memanipulasi Kandungan Iframe Menggunakan Javascript?

Bagaimanakah Saya Boleh Mengakses dan Memanipulasi Kandungan Iframe Menggunakan Javascript?

Linda Hamilton
Linda Hamiltonasal
2024-12-17 02:39:251025semak imbas

How Can I Access and Manipulate the Content of an Iframe Using Javascript?

Mendapatkan semula Kandungan Iframe dalam Javascript

Mendapatkan kandungan badan iframe dalam Javascript memerlukan pendekatan khusus. Walaupun jQuery menyediakan kaedah yang mudah, Javascript tulen menawarkan penyelesaian yang sama berkesan.

Pendekatan Javascript Tulen

  1. Dapatkan elemen iframe:

    • var iframe = document.getElementById('id_description_iframe');
    • var iframe = document.querySelector('#id_description_iframe');
  2. Dapatkan semula dokumen iframe:

    • var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

Pendekatan ini berfungsi untuk kebanyakan penyemak imbas, kerana ia mula-mula menyemak sifat contentDocument dan kembali ke contentWindow.document untuk keserasian Internet Explorer.

Memilih Elemen dan Memanggil Fungsi

Setelah anda mempunyai dokumen iframe, anda boleh menggunakan kaedah Javascript standard untuk berinteraksi dengannya:

  • Dapatkan elemen mengikut ID: iframeDocument.getElementById('frameBody') ;
  • Gunakan pemilih CSS: iframeDocument.querySelectorAll('#frameBody');
  • Dapatkan semula tetingkap iframe: var iframeWindow = iframe.contentWindow;
  • Panggil fungsi atau akses pembolehubah pada tetingkap iframe:

    • iframeWindow.myVar = window.myVar;
    • var myVar = iframeWindow.myFunction(param1 /*, ... */);

Pertimbangan

Ingat untuk mempertimbangkan dasar asal yang sama apabila bekerja dengan iframes. Jika iframe dan dokumen induk adalah daripada asal yang berbeza, sekatan silang asal mungkin dikenakan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengakses dan Memanipulasi Kandungan Iframe Menggunakan Javascript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn