lar*_*ryq 10 iframe jquery dom selector
我有一个iframe页面,里面有一个html文档.我需要从那个子文档中访问iframe的id,并且没有运气使用jQuery.基本结构是在我的页面内:
<div id="ContainingDiv">
<iframe id="ContainingiFrame">
<html>
<head></head>
<body>
</body>
</html>
</iframe>
</div>
在我的javascript方法中,我可以<body>使用jQuery选择器获取标签中的任何内容,但无法检索iframe元素以调整其大小.我已经尝试过一些东西,但我确实不是jQuery DOM导航方面的专家,特别是在涉及iframe的情况下(iframe与包含页面在同一个域中.)有没有办法可以做到这一点？
jfr*_*d00 21
根本不需要jQuery.要获取父级的body对象,可以执行以下操作:
var parentBody = window.parent.document.body
如果它与您运行代码的iframe位于同一个域中,那么一旦您拥有该代码,就可以在该对象上使用普通的javascript:
window.parent.document.getElementById("ContainingiFrame").style.height = "400px";
或者使用jQuery:
$("#ContainingiFrame", parentBody).height("400");
这是一篇关于使用示例代码在iframe中调整iframe大小的文章:http://www.pither.com/articles/2010/11/12/resize-iframe-from-within
并且,基于其自身内容调整iframe大小的相关问题/答案:基于内容调整iframe大小
要从iframe访问父文档,您可以向选择器添加一个参数,默认是文档,但没有什么可以阻止您将上下文更改为window.parent.document,如下所示:
$('#ContainingiFrame', window.parent.document).whatever();
或者在选择器之前添加它:
window.parent.$('#ContainingiFrame').whatever();
如果您没有关于iframe的信息(例如要查询的标识符),那么您希望使用窗口的frameElement,如下所示:
var iframe_tag_in_parent_window = window.frameElement;
现在您拥有iframe标记本身,可以直接在JavaScript中使用它.
要使用jQuery而不是纯JavaScript,请使用以下命令:
var iframe_in_jquery = jQuery(window.frameElement, window.parent.document);
我们刚刚谈到了第一部分(window.frameElement).第二部分是jQuery将找到元素并将其包装起来的上下文.这是我们当前窗口的父文档.
例如,如果您在iframe标记中有唯一ID,则可以执行以下操作:
var iframe_in_jquery = jQuery(window.frameElement, window.parent.document),
id = iframe_in_jquery.attr("id");
现在id是iframe您的JavaScript代码遇到的标识符.
PS如果window.frameElement为null或未定义,则表示您不在iframe.
PPS注意,要在父窗口中运行代码,您可能需要使用父实例jQuery(); 这是使用完成的window.parent.jQuery(...).如果您尝试参加trigger()活动,情况尤其如此!
PPPS确保使用window.frameElement而不仅仅是frameElement......某些浏览器有些破碎,如果没有完全合格,它们将无法始终能够访问正确的数据(尽管在2016年该问题可能得到解决？)
| 归档时间： |
|
| 查看次数： |
36905 次 |
| 最近记录： |