How to open iframe in another iframe from different/external html file
Question
I want to open an iframe in another iframe from the external file. For instance:
index.html file
<!doctype html> <html> <head> <title>Iframe 1</title> </head> <body style="text-align: center; background-color: #F4D03F; color: #333;margin: 0; padding: 0;position: absolute;width: 100%;height: 100%;"> <h1>Iframe 1</h1> <iframe id="iframe" style="border: 0; position: absolute; display: none; width: 100%; height: 100%; left: 0; top: 0"></iframe> </body> </html>Second file called iframe2.html
<!doctype html> <html> <head> <title>Iframe 2</title> </head> <body style="text-align: center; background-color: #F4D03F; color: #333;margin: 0; padding: 0;position: absolute;width: 100%;height: 100%;"> <h1>Iframe 2</h1> <iframe id="iframe" style="border: 0; position: absolute; display: none; width: 100%; height: 100%; left: 0; top: 0"></iframe> </body> </html>
and I would like to open the same identical file but as an iframe 2, after the first one is loaded . So it would be kind of the nested iframes but in separate html files. Is it overall possible?
1 answers
solution1
0 2020-03-27 15:44:09
So you're meaning something like :
if2.addEventListener("click",()=>{ let if3 = document.createElement('iframe'); if3.id="if3"; if1.appendChild(if3); });
iframe{height:250px;width:250px;border:1px solid black;} #if3{height:50px;width:50px;}
<iframe id="if1"></iframe> <iframe id="if2"></iframe>
also the word window in javascript is global so if it's called in a nested iframe you can get it back in the main document.
here is an exemple that shows window in action :
https://jsfiddle.net/josewirewax/2rqnsdd6/
and another one with lots of iframes
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.