无法刮除#document元素

Question

对于我的一个Chrome扩展项目，我通过动态填充其src属性在当前网页的<iframe>标签中获取了另一个网页的HTML内容。现在，我想从<iframe>标记中抓取一些值。但是jQuery始终将此<iframe>标记显示为空。我使用的原因是，在抓取之前，要执行的抓取页面中有一些JavaScript文件。我也尝试设置等待计时器，但是jQuery始终显示<iframe>标签为空（尽管已设置src属性）。

经调查，我发现<iframe>里面有一个奇怪的#document值，后面是普通的HTML标签。我想知道这是否是jQuery无法通过<iframe>标签内的DOM层次结构递归的原因。

请参见下面的所需<iframe>标签的“检查”视图的屏幕截图。

此外，存在<iframe>标记的主网页与新获取的网页网址在同一网站上（尽管有不同的子域）。而且我在Chrome中没有收到任何访问权限警告，因此我不认为这是跨域问题。

修改：
即使在10秒钟后等待：

console.log($("#insertHere").text());

返回空。而且，

console.log($("#insertHere").parent().html());

返回：<iframe id="insertHere" src="/courses/intro..." style="width:0;height:0;border:0; border:none;"></iframe>

Answer 1

您可以使用以下代码获取iframe内容：

$('#insertHere').contents().find("html").html();


$('#insertHere').contents().find("#MathJax_Message").text();

如果iframe在另一个域上（似乎不在您的情况下），则您的浏览器的跨站点脚本（XSS）保护将阻止它。

Answer 2

#document是iFrame DOM的页面文档对象。

尝试访问iframe的document，例如

var frame = document.getElementById('#hidden-frame');
console.log(frame.document.body);

您还可以尝试使用Content Script，并允许<all_urls>与background script一起在all pages中使用，该内容应随iframe内容一起加载，并使用该内容将内容发送到{{1 }}使用消息传递。