javascript window获取iframe、iframe获取window、document

本文总结了日常开发中window与iframe相互获取的方法。介绍了通过window获取iframe,以及通过iframe获取window、document的方式,还提及window获取顶级窗口、父窗口的方法,同时给出导航栏回退和前进操作,最后附上参考链接。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言

日常开发中,经常用到在window中获取某个iframe,或者在iframe中获取当前window。这里做个总结,记在心里后,就不用每次都百度了。

iframe和iframe的关系

首先需要说明的是,w3c已经不推荐使用frame,而推荐使用iframe,iframe也就是inline frame(行内frame),顾名思义它具有css的行内框特性,正是因为这一特性才引出来iframe 高度100%时,出现垂直滚动条

通过window获取iframe

window.frames是个伪数组,可以通过window.frames[index]或window.frames[name]来获取iframe 
window.frames[index],索引是从左往右,从上往下的,从0开始,通常我们使用window.frames[name]来获取frame

通过iframe获取window、document

如果想获取iframe里的window或者document,可以使用 
iframe.contentWindow、iframe.contentDocument 

必须是同源才可以,否则contentDocument为null
iframe.contentDocument=iframe.contentWindow.document,不过iframe.contentDocument在IE8及以下的版本不支持。

window获取顶级窗口、父窗口

获取顶级窗口:window.top 
获取父级窗口:window.parent 
导航栏回退:history.back(); 注意回退的请求,会有缓存。 
前进:history.forward() 
history.back()和history.forward()仅仅是为了方便分别代替history.go(-1)和history.go(1)

参考

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe 
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
--------------------- 
作者:干净的句号 
来源:优快云 
原文:https://blog.youkuaiyun.com/wangjun5159/article/details/78647615 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值