重新加载iframe而不闪烁/闪存（在Javascript中）

Question

我想问一下，是否有人有一个简单的解决方案，允许我重新加载/刷新iframe，但在页面重新加载时没有闪烁/闪烁，这可能吗？ 也许为动画模糊，然后模糊而不是闪烁/闪光？我不知道任何输入会有所帮助，

感谢。

以下是我现在重新加载iframe的方法

document.getElementById("FrameID").contentDocument.location.reload(true);

感谢您的帮助。

Answer 1

最简单的方法：

1. 在DOM之外或隐藏元素中创建新的iframe。
2. 将页面加载到隐藏框架内
3. 一旦负载甚至在隐藏框架内发射，只需交换它们即可！

<强>交换来实现

要实际交换它们，只需让它们彼此相邻并切换每个的display: none / block css。

Answer 2

您可以尝试将iframe放入容器div：

<div id="iframe-container">
    <iframe src="..."></iframe>
</div>

然后在您的JavaScript中创建第二个iframe，如果是第一个iframe则将其放在后面，然后隐藏第一个var container = document.getElementById('iframe-container'); var iframe2 = document.createElement('iframe'); iframe2.src = 'http://new.url.com'; iframe2.style.visibility = 'hidden'; container.appendChild(iframe2); container.removeChild(container.getElementsByTagName('iframe')[0]); iframe2.style.visibility = 'visible'; ：

{{1}}

希望这有效，我还没有测试过。您还需要使用CSS。

Answer 3

真的没有办法避免闪烁，因为这是页面刷新和渲染新内容。

您可以在刷新时隐藏iframe。在iframe中，当DOM准备就绪时，通过parent.functionName（）调用一些父函数，然后使iframe可见。