Bagaimanakah Saya Boleh Menggunakan Gaya CSS pada iFrames Dari Domain Berbeza?

Penyesuaian Merentas Domain bagi iFrames dengan CSS

Apabila bekerja dengan iFrames yang dimuatkan dari domain yang berbeza, menggunakan gaya CSS pada halaman terbenam boleh cabaran kerana dasar merentas domain penyemak imbas. Walau bagaimanapun, berikut ialah dua penyelesaian yang membolehkan anda menambah CSS dengan lancar pada iFrame anda:

1. Manipulasi Elemen Langsung:

Jika anda mempunyai akses kepada DOM iFrame, anda boleh terus menambahkan teg gaya pada kepala dokumen iframe menggunakan JavaScript.

<code class="javascript">var cssLink = document.createElement("link");
cssLink.href = "file://path/to/style.css";
cssLink.rel = "stylesheet";
cssLink.type = "text/css";
frames['iframe'].document.body.appendChild(cssLink);</code>

2. Kaedah jQuery:

Pendekatan yang lebih mesra jQuery ialah menambahkan pautan gaya pada kepala iFrame menggunakan kod berikut:

<code class="javascript">var $head = $("iframe").contents().find("head");
$head.append($("<link>", { rel: "stylesheet", href: "file://path/to/style.css", type: "text/css" }));</code>

Pertimbangan Keselamatan:

Adalah penting untuk ambil perhatian bahawa penyelesaian ini melibatkan memintas dasar merentas domain, yang mungkin menimbulkan kebimbangan keselamatan. Untuk mengurangkan perkara ini, pastikan kandungan iFrame adalah daripada sumber yang dipercayai dan fail CSS tidak mengandungi kod hasad. Jika perlu, lumpuhkan dasar asal yang sama dalam Safari untuk tujuan ujian dengan mengikut langkah yang digariskan dalam "Melumpuhkan Dasar Asal Sama dalam Safari."

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggunakan Gaya CSS pada iFrames Dari Domain Berbeza?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!