有没有办法在JavaScript控制台中将上下文更改为iframe？

107

我想更改在webkit开发人员工具/萤火虫控制台中执行的javascript的上下文，以执行其代码，就像它是从页面上的iframe内部运行一样。

我知道可以通过在单独页面上的iframe中打开页面来做到这一点，但是我想在与父框架交互的地方运行代码。

— 穆德
source

1

您可以始终以这种window.frames[x]方式执行代码。只需附加您想要的任何命令。IEwindow.frames[0].runFunction()

— LoveAndCoding

1

@Ktash，您可能想回答一个问题吗？

— Muhd

如何在IE中做同样的事情？如果元素位于内部IFRAME中，我发现使用$在控制台窗口中选择元素非常困难。请帮忙。

— tarekahf

149

Chrome 15允许您更改控制台的范围。在控制台的底部，清除控制台按钮旁边，有一个菜单，<top frame>显示将提供可用框架的列表：

在此处输入图片说明

Firefox具有当前正在开发的类似功能：

在此处输入图片说明

您还可以使用命令行在各个框架之间导航：

var frame = document.getElementById("frame1").contentWindow;
cd(frame);

— 丹尼斯
source

6

我可以在控制台中执行代码来完成同样的事情，还是必须单击框架选择器？

— bodine

@bodine-您是否已找到通过控制台命令完成此操作的方法？

— arty 2014年

1

请注意，此下拉列表现在位于控制台的顶部，而不是底部。

— Muhd

1

我在Chrome 38中看不到它。无法快速弄清楚如何在Chrome中执行此操作。在Firefox中使用了cd（frames [<index number>]）。

— Akrikos 2014年

1

多可惜。如果框架的内容发生更改，它将不会保留选定的框架。它会切换回“顶部框架”

— bryc

22

您可以<iframe>使用该window.frames[x]功能在中执行代码。例如，

window.frames[0].runFunction()

— 爱与编码
source

如果FireBug是您选择的武器，则是一个不错的选择。谢谢。

— 超现实主义梦想

1

您如何在jQuery命令之类的功能之外执行代码？或者，如果您想在某个框架下获得对DOM元素的引用，然后对该元素执行代码？

— 大卫

例如：window.frames[0].alert()

— Shayan

6

在当今的Chrome（52版）中，您要做的就是在开发工具的“元素”标签中选择iframe。您在JS控制台中运行的所有内容都会自动在所选iframe的上下文中运行。

例如，在这里我选择了一个iframe，当我document.location.pathname在控制台中键入内容时，它将返回iframe的src属性，而不是地址栏中的URL：

— dpercy
source

4

对于萤火虫解决方案，请参阅关于另一个SO问题的答案。但是，不能像Dennis的Chrome解决方案那样跨域工作。

编辑：使用较新版本的Firebug，他们可能已解决了跨域问题。

— 穆德
source

4

默认情况下，脚本语句和命令的执行是在顶级窗口的上下文中完成的。如果使用框架，请使用“ cd（）”控制台命令。

cd（） 调用不带参数的cd（）返回顶层窗口。

cd（window） 允许您将命令行表达式评估从网页的默认顶级窗口更改为框架窗口。

更多信息，在这里

— 塞巴斯蒂安
source

这正是我想要的。（在Firefox中有效）谢谢。

— user2410595 2014年

4

cd(document.getElementsByTagName('iframe')[0]);

— 安德烈卡·博纳特（Andreyka Bonart）
source

2

欢迎使用Stack Overflow！请考虑编辑您的帖子，以添加更多有关代码功能以及为什么它可以解决问题的解释。通常只包含代码（即使它在起作用）的答案通常不会帮助OP理解他们的问题。

— SuperBiasedMan

谢谢！这对于firefox来说是一种奇怪的方式，但是我想您要在控制台中输入“ cd（iframe）”来切换上下文。我给了您+1 b / c，您省下了我很多的脑筋急转弯，但您应该真正完善并解释这个帖子！

— 斯科特·史密斯史密斯，