Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Mengakses Gaya Dikira (cth., Tinggi dan Lebar) Elemen IFrame Merentas Domain?

Bagaimanakah Saya Boleh Mengakses Gaya Dikira (cth., Tinggi dan Lebar) Elemen IFrame Merentas Domain?

Susan Sarandon
Susan Sarandonasal
2024-11-30 02:16:10671semak imbas

How Can I Access Computed Styles (e.g., Height and Width) of a Cross-Domain IFrame Element?

Mengakses Gaya Berkomputer Merentas Domain

Dalam pembangunan web, mendapatkan gaya pengiraan daripada elemen merentas domain boleh menimbulkan cabaran. Dalam keadaan ini, anda berhasrat untuk mendapatkan semula gaya pengiraan ketinggian dan lebar elemen dalam iframe daripada domain yang berbeza.

Pendekatan

Untuk mengakses gaya yang dikira dalam ini senario, pertimbangkan perkara berikut pendekatan:

  • window.getComputedStyle() untuk Penyemak Imbas WebKit:

    1. Pelayar WebKit (seperti Safari dan Chrome) menyediakan tetingkap kaedah .getComputedStyle().
    2. Anda boleh menggunakannya seperti berikut:

      window.getComputedStyle(document.getElementById("frameId"), null).getPropertyValue("height");
    3. Ini mengembalikan nilai gaya yang dikira (mis., "1196px").
  • element.currentStyle untuk IE:

    1. Internet Explorer menggunakan sifat element.currentStyle untuk mengakses gaya yang dikira.
    2. Contoh penggunaan:

      document.getElementById("frameId").currentStyle.height;
    3. Perhatikan bahawa element.currentStyle hanya mencerminkan gaya yang ditetapkan secara eksplisit pada elemen, bukan dikira nilai.
  • Menavigasi ke DOM iFrame:

    1. Jika anda perlu mengakses gaya pengiraan kandungan iframe ( cth., elemen HTML), anda boleh menavigasi ke dalam iFrame DOM.
    2. Gunakan iframeObject.contentDocument.documentElement untuk mengakses elemen akar dokumen iFrame.
    3. Anda kemudiannya boleh menggunakan window.getComputedStyle() atau element.currentStyle kepada elemen yang sesuai dalam iframe DOM.

Contoh

Menggunakan kod yang anda berikan, berikut ialah contoh cara untuk mendapatkan semula gaya pengiraan ketinggian HTML elemen dalam iframe menggunakan window.getComputedStyle():

window.getComputedStyle(document.getElementById("frameId").contentDocument.documentElement, null).getPropertyValue("height");

Nota Tambahan

  • Pastikan iframe mempunyai atribut id untuk memudahkan pemilihan elemen.
  • Nilai ketinggian dan lebar yang dinyatakan dalam tangkapan skrin anda kelihatan dalam piksel, tetapi adalah penting untuk mengesahkan unitnya dalam senario sebenar anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengakses Gaya Dikira (cth., Tinggi dan Lebar) Elemen IFrame Merentas Domain?. 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