且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

当我改变它在DOM中的位置时,如何停止IFrame重新加载?

更新时间:2023-09-23 08:37:16

考虑到你的测试用例的简单性,看起来你可以将元素放在另一个元素中的唯一方法总是强制重载内容。



[编辑]在看到您要做的事情之后,您可以尝试以下几项:


  1. 所有广告都可以在IFRAME中投放(在您自己的网站上),这样不会占用页面的空间,并且可以立即放置在正确的位置。
  2. 如上所述,IFRAME不会阻止加载页面,因此如果他们是IFRAME,可以立即将广告放在适当位置,如果他们是其他内容,则将其加载到底部。当然,如果缓慢的部分是在你知道你是否要获得一个IFRAME之前,这是行不通的。

  3. 你可以将内容保留在占位符DIV中,但是当它完成加载只是重新定位(与CSS绝对定位)在页面的正确位置。不是最优雅的解决方案,但应该正常工作。


Is there any way to stop an Iframe re-loading it's contents when I change it's position within the DOM? Simple example:

<script type="text/javascript">
function moveiframe() {
    var dest = document.getElementById('newparent');
    dest.appendChild(document.getElementById('googleframe'));
}
</script>
<iframe src="http://www.google.com" id="googleframe"></iframe>
<input type="button" onclick="moveiframe()" value="Move" />

clicking the "Move" button changes the parent of the iframe, and reloads its contents (in Firefox and Chrome, but not IE).

Any suggestions would be much appreciated!

[Updated with background info]

I'm loading the site's adverts in placeholder divs at the bottom of the page (to prevent advert loading from holding up the page load) - and then shifting the divs they've been written in to their correct container once loaded. It all works great... unless the ad that gets served uses an iframe (like google adsense) in which case the ad gets loaded twice and the serving is messed up.

Considering the simplicity of your test case, it looks like the only methods you have available to put an element inside another will always force the contents to reload.

[Edit] After seeing what you're trying to do, there are a couple things you can try:

  1. All ads could be served in IFRAMEs (on your own site) which will not hold up loading of the page and can be placed in the right place right away.
  2. As mentioned above IFRAMEs won't hold up loading of the page so you could put the ads in place right away if they are IFRAMEs and load them at the bottom if they are something else. Of course, this won't work if the slow part is before you know if you are going to get an IFRAME or not.
  3. You could keep the content in it's placeholder DIV but when it's done loading just reposition (with CSS absolute positioning) over the right place in the page. Not the most elegant solution, but should work fine.