2016-07-20 8 views
4

Ich habe für eine Weile auf einer dieser Programmierung Herausforderung Websites gekämpft. Es hat eine Art von Konsole, mit der ich Javascript eingeben und eine Run-Taste drücken kann. Ich muss einen iframe innerhalb dieser Webseite mit einer anderen Webseite innerhalb davon erstellen (zum Beispiel, ich bin auf thiswebsite.com/level1 und ich muss den iframe mit thiswebsite.com/level2 innerhalb davon herstellen).Erstellen Sie einen iframe mit nur Javascript

Haben Erstellen iframes versucht wie folgt:

document.getElementById('someDiv').innerHTML = '<iframe src="thissite.com/level2/" height= 300 width=400>'; 

jedoch nicht ausgeführt wird, wenn ich das versuchen, gibt es eine alternative Art und Weise? Danke.

+0

Was ist Ihr Problem zu sein scheint? Ich kopiere und steckte den Exact-Code in eine jsfiddle (mit einer anderen Quelle) und es funktioniert https://jsfiddle.net/yah18c73/1/ –

+0

Die Website würde es einfach nicht ausführen, ich nehme an, dass es nach einer anderen Lösung gesucht hat Die unten angegebene Antwort wurde kompiliert und ausgeführt. Deshalb steckte ich fest, weil mein Code hätte funktionieren sollen. –

Antwort

5

Verwenden createElement Methode von document

var a = document.createElement('iframe'); 
a.src = "your path will go here"; //add your iframe path here 
a.width = "1000"; 
a.height = "500"; 
document.querySelector('body').appendChild(a) 

ich hänge Sie einfach die iframe-body. Um hängen Sie ihn an someDiv ersetzt letzte Zeile mit folgendem Code

document.getElementById('someDiv').appendChild(a); 
+0

Gibt es eine Möglichkeit, die Größe darauf einzustellen? Auch diese Antwort läuft, danke. –

+0

Wc. bearbeitet die Antwortprüfung. Sie können jede Eigenschaft angeben, die ein gültiges HTML-Attribut ist. Ich werde vorschlagen, Klassennamen hinzuzufügen – murli2308

+0

'a.width' und' a.height' scheint nur das zu tun – xameeramir

0

ich Zweifel, dass die Website nicht zulässt iframes zu erstellen.

Wie, wenn Sie versuchen, den folgenden Code in Ihrer Console

//define function 
    function prepareiFrame() { 
     var ifrm = document.createElement("iframe"); 
     ifrm.setAttribute("src", "https://google.com/"); 
     ifrm.style.width = "640px"; 
     ifrm.style.height = "480px"; 
     document.body.appendChild(ifrm); 
    } 

    //call it 
    prepareiFrame() 

Stackoverflow wird die folgenden Fehler werfen:

Refused to display ' https://www.google.co.in/?gfe_rd=cr&ei=OoWPV7agCuHt8wf3v6egDA ' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.