Czy istnieje sposób na zmianę kontekstu na iframe w konsoli javascript?

107

Chciałbym zmienić kontekst javascript wykonywanego w narzędziu programistycznym webkit / konsoli firebug, aby wykonywał jego kod tak, jakby był uruchamiany z wnętrza elementu iframe na stronie.

Wiem, że mógłbym to zrobić, otwierając stronę w ramce iframe na oddzielnej stronie, ale chcę uruchomić kod, w którym współdziała z ramką nadrzędną.

javascript iframe console firebug Muhd
źródło
1
zawsze możesz wykonać kod w window.frames[x]modny sposób. Po prostu dołącz dowolne polecenie. IEwindow.frames[0].runFunction()
LoveAndCoding
1
@Ktash, czy może chciałbyś, aby to była odpowiedź?
Muhd
Jak mogę zrobić to samo w IE? Bardzo trudno jest wybrać element w oknie konsoli za pomocą $, jeśli element znajduje się w wewnętrznej ramce IFRAME. Proszę pomóż.
tarekahf

Odpowiedzi:

149

Chrome 15 umożliwia zmianę zakresu konsoli. W dolnej części konsoli, obok przycisku czyszczenia konsoli, znajduje się menu, które mówi, <top frame>które wyświetli listę dostępnych ramek:

wprowadź opis obrazu tutaj

Firefox ma podobną funkcję, która jest obecnie w fazie rozwoju:

wprowadź opis obrazu tutaj

Możesz także nawigować po ramkach za pomocą wiersza poleceń :

var frame = document.getElementById("frame1").contentWindow;
cd(frame);
Dennis
źródło
6
Czy mogę wykonać kod w konsoli, aby osiągnąć to samo, czy muszę kliknąć selektor ramki?
bodine
@bodine - czy znalazłeś sposób, aby to zrobić za pomocą polecenia konsoli?
arty
1
Zwróć uwagę, że to menu znajduje się teraz u góry konsoli, a nie u dołu.
Muhd
1
Nie widzę tego w Chrome 38. Nie mogę szybko dowiedzieć się, jak to zrobić w Chrome; zamiast tego użył cd (frames [<numer indeksu>]) w przeglądarce Firefox.
Akrikos
1
Jaka szkoda. Nie zachowa wybranej klatki, jeśli zawartość ramki zostanie zmieniona. Przełącza się z powrotem na „górną klatkę”
bryc
22

Możesz wykonać kod w <iframe>s za pomocą window.frames[x]funkcji. Na przykład,

window.frames[0].runFunction()
LoveAndCoding
źródło
Dobra alternatywa, jeśli FireBug jest Twoją ulubioną bronią. Dzięki.
Surreal Dreams
1
Jak wykonać kod poza funkcjami, takimi jak polecenia jQuery? A jeśli chcesz uzyskać odniesienie do elementu DOM pod jakąś ramką, wykonaj kod na tym elemencie?
David
Oto przykład:window.frames[0].alert()
Shayan
6

W dzisiejszej przeglądarce Chrome (wersja 52) wszystko, co musisz zrobić, to wybrać element iframe na karcie „Elementy” narzędzi programistycznych. Wszystko, co uruchomisz w konsoli JS, zostanie automatycznie uruchomione w kontekście wybranego elementu iframe.

Na przykład tutaj wybrałem iframe, a kiedy piszę document.location.pathnamew konsoli, zwraca atrybut src elementu iframe, zamiast adresu URL z paska adresu:

wprowadź opis obrazu tutaj

dpercy
źródło
4

W przypadku rozwiązania firebug zobacz tę odpowiedź na inne pytanie SO. Nie działa jednak między domenami, tak jak rozwiązanie Dennisa Chrome.

Edycja: w nowszych wersjach programu firebug mógł rozwiązać problem między domenami.

Muhd
źródło
4

Wykonywanie instrukcji i poleceń skryptów domyślnie odbywa się w kontekście okna najwyższego poziomu. Jeśli używasz ramek, użyj polecenia konsoli "cd ()".

cd () Wywołanie cd () bez parametrów powoduje powrót do okna najwyższego poziomu.

cd (okno) Umożliwia zmianę obliczania wyrażenia wiersza polecenia z domyślnego okna najwyższego poziomu strony internetowej na okno ramki.

Więcej informacji tutaj

Sebastian
źródło
To jest dokładnie to, czego szukałem. (działa w Firefoksie) Dzięki.
user2410595,
4 
cd(document.getElementsByTagName('iframe')[0]);
Andreyka Bonart
źródło
2
Witamy w Stack Overflow! Rozważ edycję swojego posta, aby dodać więcej wyjaśnień na temat tego, co robi Twój kod i dlaczego rozwiąże problem. Odpowiedź, która w większości zawiera tylko kod (nawet jeśli działa), zwykle nie pomoże OP w zrozumieniu problemu.
SuperBiasedMan
Dzięki! To dziwny sposób na zrobienie tego przez Firefoksa, ale wydaje mi się, że „cd (iframe)” jest tym, co wpisujesz w konsoli, aby zmienić kontekst. Dałem ci +1 b / c, dzięki czemu zaoszczędziłem mnóstwo headbangingu, ale naprawdę powinieneś dopracować ten post i wyjaśnić to!
Scott Smith