最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
问答文章1 问答文章501 问答文章1001 问答文章1501 问答文章2001 问答文章2501 问答文章3001 问答文章3501 问答文章4001 问答文章4501 问答文章5001 问答文章5501 问答文章6001 问答文章6501 问答文章7001 问答文章7501 问答文章8001 问答文章8501 问答文章9001 问答文章9501
当前位置: 首页 - 科技 - 知识百科 - 正文

通过伪协议解决父页面与iframe页面通信的问题_javascript技巧

来源:懂视网 责编:小采 时间:2020-11-27 21:36:40
文档

通过伪协议解决父页面与iframe页面通信的问题_javascript技巧

通过伪协议解决父页面与iframe页面通信的问题_javascript技巧:我们经常会有父页面与iframe页面的操作,比如 这个iframe里面的内容是js写的。如以下代码 var iframe = document.getElementById(iframe), doc = iframe.contentWindow.document; doc.open(); doc.write(--
推荐度:
导读通过伪协议解决父页面与iframe页面通信的问题_javascript技巧:我们经常会有父页面与iframe页面的操作,比如 这个iframe里面的内容是js写的。如以下代码 var iframe = document.getElementById(iframe), doc = iframe.contentWindow.document; doc.open(); doc.write(--

我们经常会有父页面与iframe页面的操作,比如

这个iframe里面的内容是js写的。如以下代码

以上代码在大多数情况下是对的。但有种情况,即父页面显式的写了document.domain = "xxx";

在ie系列(IE10没试过)会出现没权限的错误。 而在firefox, chrome都没问题.

这是为什么呢?这是ie的一个bug, 即父页没有显式的设置document.domain时,iframe会默认document.domain与父页面一致,即都是

location.host,父子页面是可以进行通信,即文章头的例子, 但当父页面显式的设置了document.domain="", iframe里面的页面必须也显式的设置document.domain="xxx",否则是

没有权限得到iframe.contentWindow.document的, 即也没办法去动态写内容,其实也可以让iframe指向一个特定的页面,这个页面显式的设置document.domain="xxx",再通过文章开头的方

的方式来写,但问题是我的父页面有很多这样的iframe,个数是未知的(都是广告位),所以也不能通过特定页面。

这样问题就来了,在这种情况下,我们貌似没有办法

1. 父页面设置了并且必须会显式的设置document.domain

2.iframe页面的内容需要js动态生成。

3.没有机会为iframe设置src。

但上面3个条件都满足时,我们可以通过伪协议来解决此类的问题。

代码如下:
iframe.src="javascript:void((function(){var d=document;d.open();d.domain='xxx;d.write('---something');d.close()})())";

通过这种方式可以显式的设置iframe的document.domain与父页面一致。

这样写了后,的确实现了动态写iframe内容的需求,但这个页面会单独弹出来,像window.open();
这是为什么呢? 这也是ie系列的bug ,即父页面有, 通过iframe的伪协议所写的内容会类似window.open一样弹出新页面,
但父页面的又必须是_self, 所以只能在调用iframe.src之前将base的target设置为_self, 内容写完后,再将base的target设为_blank

这样就解决了此问题。

虽然伪协议可以解决此问题,但也有些风险,如果不到万不得已,也别随便用这种方式。

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文档

通过伪协议解决父页面与iframe页面通信的问题_javascript技巧

通过伪协议解决父页面与iframe页面通信的问题_javascript技巧:我们经常会有父页面与iframe页面的操作,比如 这个iframe里面的内容是js写的。如以下代码 var iframe = document.getElementById(iframe), doc = iframe.contentWindow.document; doc.open(); doc.write(--
推荐度:
标签: 通信 通过 iframe
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top