Gibt es eine Möglichkeit, den Kontext in der Javascript-Konsole in iframe zu ändern?

106

Ich möchte den Kontext des im Webkit-Entwicklertool / in der Firebug-Konsole ausgeführten Javascript ändern, um seinen Code so auszuführen, als würde er in einem Iframe auf der Seite ausgeführt.

Ich weiß, dass ich dies tun kann, indem ich die Seite im Iframe auf einer separaten Seite öffne, aber ich möchte Code ausführen, der mit dem übergeordneten Frame interagiert.

Muhd
quelle
1
Sie können Code immer in der Art und window.frames[x]Weise ausführen . Fügen Sie einfach den gewünschten Befehl hinzu. IEwindow.frames[0].runFunction()
LoveAndCoding
1
@Ktash, möchtest du das vielleicht eine Antwort geben?
Muhd
Wie kann ich dasselbe im IE tun? Ich finde es äußerst schwierig, ein Element im Konsolenfenster mit $ auszuwählen, wenn sich das Element in einem inneren IFRAME befindet. Bitte helfen Sie.
Tarekahf

Antworten:

149

Mit Chrome 15 können Sie den Umfang der Konsole ändern. Am unteren Rand der Konsole befindet sich neben der Schaltfläche zum Löschen der Konsole ein Menü mit <top frame>einer Liste der verfügbaren Frames:

Geben Sie hier die Bildbeschreibung ein

Firefox hat eine ähnliche Funktion, die derzeit entwickelt wird:

Geben Sie hier die Bildbeschreibung ein


Sie können auch über die Befehlszeile über Frames navigieren :

var frame = document.getElementById("frame1").contentWindow;
cd(frame);
Dennis
quelle
6
Kann ich Code in der Konsole ausführen, um dasselbe zu erreichen, oder muss ich auf die Frame-Auswahl klicken?
Körper
@bodine - Haben Sie einen Weg gefunden, dies mit dem Konsolenbefehl zu erreichen?
Arty
1
Beachten Sie, dass sich dieses Dropdown-Menü jetzt oben auf der Konsole und nicht mehr unten befindet.
Muhd
1
Ich sehe das in Chrome 38 nicht. Ich konnte nicht schnell herausfinden, wie das in Chrome geht. verwendete stattdessen die CD (Frames [<Indexnummer>]) in Firefox.
Akrikos
1
Schade. Der ausgewählte Frame wird nicht beibehalten, wenn der Inhalt des Frames geändert wird. Es wechselt zurück zu "Top Frame"
Bryc
22

Sie können Code in <iframe>s ausführen, indem Sie die window.frames[x]Funktionalität verwenden. Beispielsweise,

window.frames[0].runFunction()
LoveAndCoding
quelle
Eine gute Alternative, wenn FireBug die Waffe Ihrer Wahl ist. Vielen Dank.
Surreale Träume
1
Wie würden Sie Code außerhalb von Funktionen wie jQuery-Befehlen ausführen? Oder wenn Sie einen Verweis auf ein DOM-Element unter einem Frame erhalten möchten, führen Sie Code für dieses Element aus?
David
Als Beispiel wäre:window.frames[0].alert()
Shayan
6

In der heutigen Version von Chrome (Version 52) müssen Sie lediglich den Iframe auf der Registerkarte "Elemente" der Entwicklertools auswählen. Alles, was Sie in der JS-Konsole ausführen, wird automatisch im Kontext des ausgewählten Iframes ausgeführt.

Hier habe ich beispielsweise einen Iframe ausgewählt. Wenn ich document.location.pathnamein die Konsole tippe, wird anstelle der URL aus der Adressleiste das src-Attribut des Iframes zurückgegeben:

Geben Sie hier die Bildbeschreibung ein

Dpercy
quelle
4

Eine Firebug-Lösung finden Sie in dieser Antwort auf einer anderen SO-Frage. Funktioniert jedoch nicht domänenübergreifend wie Dennis 'Chrome-Lösung.

Bearbeiten: Bei neueren Versionen von Firebug wurde möglicherweise ein domänenübergreifendes Problem behoben.

Muhd
quelle
4

Die Ausführung von Skriptanweisungen und Befehlen erfolgt standardmäßig im Kontext des Fensters der obersten Ebene. Wenn Sie Frames verwenden, verwenden Sie den Konsolenbefehl "cd ()".

cd () Wenn Sie cd () ohne Parameter aufrufen, kehren Sie zum Fenster der obersten Ebene zurück.

cd (Fenster) Ermöglicht das Ändern der Auswertung von Befehlszeilenausdrücken vom Standardfenster der obersten Ebene der Webseite in das Fenster eines Frames.

Mehr Infos hier

Sebastian
quelle
Es ist genau das, wonach ich gesucht habe. (es funktioniert in Firefox) Danke.
user2410595
3
cd(document.getElementsByTagName('iframe')[0]);
Andreyka Bonart
quelle
2
Willkommen bei Stack Overflow! Bitte überlegen Sie, Ihren Beitrag zu bearbeiten, um weitere Erklärungen dazu hinzuzufügen, was Ihr Code tut und warum er das Problem löst. Eine Antwort, die meistens nur Code enthält (auch wenn sie funktioniert), hilft dem OP normalerweise nicht, ihr Problem zu verstehen.
SuperBiasedMan
Vielen Dank! Dies ist eine seltsame Möglichkeit für Firefox, dies zu tun, aber ich denke, "cd (iframe)" ist das, was Sie in die Konsole eingeben, um den Kontext zu wechseln. Ich habe dir eine +1 b / c gegeben, du hast mir jede Menge Headbangen erspart, aber du solltest diesen Beitrag wirklich aufpolieren und erklären!
Scott Smith