Rumah hujung hadapan web tutorial js JavaScript 处理Iframe自适应高度(同或不同域名下)_javascript技巧

JavaScript 处理Iframe自适应高度(同或不同域名下)_javascript技巧

May 16, 2016 pm 05:38 PM
iframe

1.同域名下Iframe自适应高度的处理
复制代码 代码如下:



当然此处我用的是Asp.Net MVC 此处src设置为路由结构
复制代码 代码如下:



用到的就是iframe嵌套的页面加载完毕的时候,运用onload事件来获取嵌套在iframe中网页的高度,然后赋值给Iframe的高度即可。
2.跨域时Iframe高度自适应
复制代码 代码如下:

在主页面和被嵌套的iframe为不同域名的时候,就稍微麻烦一些,需要避开JavaScript的跨域限制。
原理:现有iframe主页面main.html、被iframe嵌套页面iframe.html、iframe中介页面agent.html三个,通过main.html(域名为http://www.ccvita.com)嵌套iframe.html(域名为:http://www.phpq.net),当用户浏览时执行iframe.html中的JavaScript代码设置iframeC的scr地址中加入iframe页面的高度,agent.html(域名为:http://www.ccvita.com)取得传递的高度,通过JavaScript设置main.html中iframe的高度。最终实现预期的目标。

iframe主页面main.html
[code]


iframe主页面





尾部




iframe嵌套页面iframe.html
复制代码 代码如下:



被iframe嵌套页面

文字










文字










文字










文字















iframe中介页面agent.html
复制代码 代码如下:



iframe中介页面

<script> <BR>function pseth() { <BR>var iObj = parent.parent.document.getElementByIdx('frame_content'); <BR>iObjH = parent.parent.frames["frame_content"].frames["iframeC"].location.hash; <BR>iObj.style.height = iObjH.split("#")[1]+"px"; <BR>} <BR>pseth(); <BR></script>



代码里,kimi可能路径表示不全
main.html 与 agent.html 是必须同一个域里
而iframe.html在另一个域
Kenyataan Laman Web ini
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

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

<🎜>: Bubble Gum Simulator Infinity - Cara Mendapatkan dan Menggunakan Kekunci Diraja
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Nordhold: Sistem Fusion, dijelaskan
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers of the Witch Tree - Cara Membuka Kunci Cangkuk Bergelut
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1665
14
Tutorial PHP
1270
29
Tutorial C#
1250
24
Bagaimanakah cara saya memangkas IFrame dalam HTML? Bagaimanakah cara saya memangkas IFrame dalam HTML? Aug 29, 2023 pm 04:33 PM

Bingkai sebaris dipanggil iframe dalam HTML. Label menentukan kawasan segi empat tepat dalam kandungan di mana penyemak imbas boleh memaparkan dokumen yang berbeza dengan bar skrol dan sempadan. Untuk membenamkan dokumen lain dalam dokumen HTML semasa, gunakan bingkai sebaris. Rujukan kepada elemen boleh ditentukan menggunakan atribut nama HTMLiframe. Dalam JavaScript, rujukan kepada elemen juga dibuat menggunakan atribut nama. Iframe pada asasnya digunakan untuk memaparkan halaman web dalam halaman web yang sedang dipaparkan. URL dokumen yang mengandungi iframe ditentukan menggunakan atribut "src". Sintaks Berikut ialah sintaks HTML <iframesrc="URL"title="d

Mengapa iframe dimuatkan dengan perlahan? Mengapa iframe dimuatkan dengan perlahan? Aug 24, 2023 pm 05:51 PM

Sebab untuk memuatkan iframe yang perlahan terutamanya termasuk kelewatan rangkaian, masa pemuatan sumber yang lama, susunan pemuatan, mekanisme caching dan dasar keselamatan. Pengenalan terperinci: 1. Kelewatan rangkaian Apabila pelayar memuatkan halaman web yang mengandungi iframe, ia perlu menghantar permintaan kepada pelayan untuk mendapatkan kandungan dalam iframe Jika kelewatan rangkaian adalah tinggi, masa untuk mendapatkan kandungan akan meningkat, mengakibatkan pemuatan iframe yang perlahan ; dll.

Apakah maksud data-id dalam iframe? Apakah maksud data-id dalam iframe? Aug 28, 2023 pm 02:25 PM

Data-id dalam iframe merujuk kepada atribut tersuai yang digunakan dalam teg HTML untuk menyimpan pengecam elemen tertentu. Dengan menggunakan atribut data-id, anda boleh menambah pengecam unik pada elemen iframe supaya ia boleh dimanipulasi dan diakses dalam JavaScript. Penamaan atribut data-id boleh disesuaikan mengikut keperluan khusus, tetapi beberapa konvensyen penamaan biasanya diikuti untuk memastikan keunikan dan kebolehbacaannya. Atribut data-id juga boleh digunakan untuk mengenal pasti dan memanipulasi iframe tertentu.

Microsoft: Ralat Outlook memuat turun fail 'TokenFactoryIframe' pada setiap lawatan Microsoft: Ralat Outlook memuat turun fail 'TokenFactoryIframe' pada setiap lawatan Apr 19, 2023 am 08:25 AM

Microsoft Outlook sedang memuat turun fail misteri yang dipanggil "TokenFactoryIframe" pada macOS apabila pengguna mengakses perkhidmatan e-mel melalui pelayar Safari. Isu ini kini telah dilaporkan secara meluas oleh pengguna yang telah menemui fail "TokenFactoryIframe" yang dimuat turun oleh Outlook pada setiap lawatan. Outlook memuat turun fail misteri ini setiap beberapa saat atau sekurang-kurangnya setiap kali anda mengakses Outlook pada platform Apple. Berdasarkan penemuan kami, ini nampaknya merupakan isu yang disebabkan oleh kemas kini sebelah pelayan yang tidak betul yang disiarkan ke Outlook dan tiada kaitan dengan Safari atau macOS. Microsoft dalam satu salinan

Apakah teknologi yang boleh menggantikan iframe Apakah teknologi yang boleh menggantikan iframe Aug 24, 2023 pm 01:53 PM

Teknologi yang boleh menggantikan iframe termasuk Ajax, perpustakaan atau rangka kerja JavaScript, teknologi komponen Web, penghalaan bahagian hadapan dan pemaparan sebelah pelayan. Pengenalan terperinci: 1. Ajax ialah teknologi yang digunakan untuk mencipta laman web dinamik. Ia boleh mencapai kemas kini tak segerak halaman dengan menukar data dengan pelayan di latar belakang tanpa menyegarkan keseluruhan halaman Menggunakan Ajax boleh memuatkan dan memaparkan kandungan dengan lebih fleksibel, dan tidak perlu menggunakan iframe untuk membenamkan halaman lain atau rangka kerja , seperti React dan sebagainya.

Apakah peristiwa pemuatan iframe? Apakah peristiwa pemuatan iframe? Aug 28, 2023 pm 01:55 PM

Peristiwa pemuatan iframe termasuk acara onload, acara onreadystatechange, acara onbeforeunload, acara onerror, acara onabort, dsb. Penerangan terperinci: 1. acara onload, menentukan kod JavaScript untuk dilaksanakan selepas memuatkan acara iframe 2. onreadystatechange, menentukan kod JavaScript untuk dilaksanakan apabila keadaan iframe berubah, dsb.

Apakah bahaya dalam iframes Apakah bahaya dalam iframes Sep 08, 2023 pm 03:14 PM

Bahaya dalam iframe terutamanya termasuk: 1. Kerentanan keselamatan halaman web berniat jahat boleh memuatkan halaman web lain melalui iframe dan melakukan beberapa serangan 2. Penembusan dasar yang sama Dengan memuatkan halaman web di bawah nama domain lain, yang sama-. Dasar asal boleh dilanggar Strategi untuk mencapai komunikasi merentas domain, yang mungkin diserang secara berniat jahat 3. Isu pelaksanaan kod, halaman web yang dimuatkan dalam iframes boleh melaksanakan kod JS, yang mungkin menyebabkan beberapa isu keselamatan; mungkin tidak dapat menghuraikan dengan betul dan kandungan Indeks dimuatkan melalui iframe dan banyak lagi.

Apakah maksud iframe dalam Python? Apakah maksud iframe dalam Python? Aug 25, 2023 pm 03:24 PM

iframe dalam Python ialah teg HTML yang digunakan untuk membenamkan halaman web atau dokumen lain dalam halaman web. Dalam Python, anda boleh menggunakan pelbagai perpustakaan dan rangka kerja untuk memproses dan memanipulasi iframe, yang paling biasa digunakan ialah perpustakaan BeautifulSoup, yang boleh mengekstrak kandungan iframe dengan mudah daripada halaman web dan memanipulasi serta memprosesnya. Mengetahui cara mengendalikan dan memanipulasi iframe sangat berguna untuk pembangunan web dan mengikis data.

See all articles