使用jQuery我试图访问DIV ID =“元素”。
<body>
<iframe id="uploads">
<iframe>
<div id="element">...</div>
</iframe>
</iframe>
</body>
所有的iframe会在没有WWW /非www问题同一个域。
我已经成功地选择第一iframe中的元素但不是所述第二嵌套iframe。
我已经尝试了几件事情，这是最近的（和一个漂亮的绝望的尝试）。
var iframe = jQuery('#upload').contents();
var iframeInner = jQuery(iframe).find('iframe').contents();
var iframeContent = jQuery(iframeInner).contents().find('#element');
// iframeContent is null
编辑：为了排除我用了一个点击事件，等了一会儿一个时间问题。
jQuery().click(function(){
var iframe = jQuery('#upload').contents().find('iframe');
console.log(iframe.find('#element')); // [] null
});
有任何想法吗？ 谢谢。
更新：我可以选择像这样的第二iFrame ...
var iframe = jQuery('#upload').contents().find('iframe');
现在的问题似乎是，作为IFRAME与JavaScript生成的SRC是空的。 这样的IFRAME被选择但内容长度为0。
Answer 1:
事情是，你所提供的代码将无法工作，因为<iframe>元素必须有一个“源”属性，如：
<iframe id="uploads" src="http://domain/page.html"></iframe>
这是确定使用.contents()获取内容：
$('#uploads).contents()将给您访问第二iFrame，但如果iframe是‘内部’ http://domain/page.html文档#uploads iframe中加载。
为了测试我是对这个，我创建了一个名为3个main.html中，Iframe.html的和noframe.html HTML文件，然后选择在div＃元素就好用：
$('#uploads').contents().find('iframe').contents().find('#element');
会有，因为你需要等待的iframe加载资源元素将不可用，其中延误。 此外，所有的I帧必须在同一个域。
希望这可以帮助 ...
这里有云的HTML我用了3个文件（替换“源”与您的域和URL属性）：
main.html中
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>main.html example</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(function () {
console.log( $('#uploads').contents().find('iframe').contents().find('#element') ); // nothing at first
setTimeout( function () {
console.log( $('#uploads').contents().find('iframe').contents().find('#element') ); // wait and you'll have it
}, 2000 );
});
</script>
</head>
<body>
<iframe id="uploads" src="http://192.168.1.70/test/iframe.html"></iframe>
</body>
Iframe.html的
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>iframe.html example</title>
</head>
<body>
<iframe src="http://192.168.1.70/test/noframe.html"></iframe>
</body>
noframe.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>noframe.html example</title>
</head>
<body>
<div id="element">some content</div>
</body>
Answer 2:
var iframeInner = jQuery(iframe).find('iframe').contents();
var iframeContent = jQuery(iframeInner).contents().find('#element');
iframeInner包含元素
<div id="element">other markup goes here</div>
和iframeContent会发现它们的内部元素
<div id="element">other markup goes here</div>
（找到当前元素上不搜索），这就是为什么它返回NULL。
Answer 3:
嘿，我得到的东西，这似乎是做你想要做什么。 它涉及到一些肮脏的复制，但工程。 您可以找到工作代码这里
因此，这里是主要的HTML文件：
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
Iframe = $('#frame1');
Iframe.on('load', function(){
IframeInner = Iframe.contents().find('iframe');
IframeInnerClone = IframeInner.clone();
IframeInnerClone.insertAfter($('#insertIframeAfter')).css({display:'none'});
IframeInnerClone.on('load', function(){
IframeContents = IframeInner.contents();
YourNestedEl = IframeContents.find('div');
$('<div>Yeepi! I can even insert stuff!</div>').insertAfter(YourNestedEl)
});
});
});
</script>
</head>
<body>
<div id="insertIframeAfter">Hello!!!!</div>
<iframe id="frame1" src="Test_Iframe.html">
</iframe>
</body>
</html>
正如你所看到的，一旦第一个iframe中加载，我得到的第二个和克隆。 然后我重新插入在DOM，所以我可以访问onload事件。 一旦这个人是装的，我检索非克隆的一个内容（必须加载为好，因为它们使用相同的SRC）。 然后，你可以做wathever你想要的内容。
这里是Test_Iframe.html文件：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>Test_Iframe</div>
<iframe src="Test_Iframe2.html">
</iframe>
</body>
</html>
和Test_Iframe2.html文件：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>I am the second nested iframe</div>
</body>
</html>
Answer 4:
你可能有一个时机的问题。 在第二的iFrame被加载之前，您的document.ready称道的可能是射击。 你没有足够的信息来帮助不大further-但我们知道，如果这似乎是可能的问题。
Answer 5:
您应该使用现场方法将在稍后呈现，如颜色框元素，隐藏字段或iframe
$(".inverter-value").live("change",function() {
elem = this
$.ajax({
url: '/main/invertor_attribute/',
type: 'POST',
aysnc: false,
data: {id: $(this).val() },
success: function(data){
// code
},
dataType: 'html'
});
});
Answer 6:
我觉得达到你的div的最佳方式：
var your_element=$('iframe#uploads').children('iframe').children('div#element');
它应该很好地工作。
Answer 7:
如果浏览器支持的iframe，然后DOM里面的iframe来自各个标签的src属性。 内容是内部的iframe标签用作回退机制，其中的浏览器不支持iframe标签。
参考： http://www.w3schools.com/tags/tag_iframe.asp
Answer 8:
我猜你的问题是，jQuery是不是在你的I帧加载。
最安全的做法是依靠纯粹基于DOM的方法来解析您的内容。
否则，开始使用jQuery，然后一旦你的内部框架内，测试一次，如果typeof window.jQuery == 'undefined' ，如果这是真的，jQuery是不是里面启用和后备基于DOM的方法。
文章来源: Nested iframes, AKA Iframe Inception
