Javascript 将 iFrame CSS 设置为在加载期间显示：无
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12661614/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Setting iFrame CSS to display:none during load
提问by ShadowStorm
I have this:
我有这个：
<div class="upload_slide">
<iframe class="upload_iframe" style="visibility:hidden;"></iframe>
</div>
If I then post some files to the iFrame and set .upload_slideto display:none;, while it's loading, will this affect the loading of the iFrame or the detection of when it finished loading?
如果我然后将一些文件发布到 iFrame 并设置.upload_slide为display:none;，在加载时，这会影响 iFrame 的加载或检测完成加载的时间吗？
采纳答案by TheCarver
No, the iFrame's loading and load detection should not be compromised by setting the display to none.
不，iFrame 的加载和加载检测不应因将显示设置为无而受到影响。
CSS is just for style, it has no ability to affect the DOM.
CSS 只是为了样式，它没有能力影响 DOM。
回答by robC
There shouldn't be a problem but if there is, a good trick can be to move the element offscreen rather than hiding it. You can create a class like
应该没有问题，但如果有，一个很好的技巧是将元素移出屏幕而不是隐藏它。你可以创建一个类
.offscreen{
position: absolute;
left: -5000px;
}
which you can add and remove as needed.
您可以根据需要添加和删除。
回答by Ricardinho
Firefox currently does have an issue with display:none:
Firefox 当前确实存在 display:none 问题：
Some browsers assume that when "display:none" is applied to replaced elements (like Flash or an iframe) the visual info for that element is no longer needed. So, if the element is later displayed by the CSS, the browser will actually recreate the visual data form scratch.
I imagine that having the iframe default to "display:none;" makes the browser skip the rendering of the HTML so the tags don't have any dimensions. I would set the visibility to "hidden" or position it off the page rather than use "display:none;".
Steven Paligo
一些浏览器假定当“display:none”应用于替换元素（如 Flash 或 iframe）时，不再需要该元素的视觉信息。因此，如果该元素稍后由 CSS 显示，浏览器实际上会重新创建可视数据表单。
我想将 iframe 默认设置为“display:none;” 使浏览器跳过 HTML 的呈现，因此标签没有任何尺寸。我会将可见性设置为“隐藏”或将其放置在页面之外，而不是使用“显示：无；”。
史蒂文·帕里戈
回答by balanv
Nope.. Not at all..
不.. 一点也不..
CSS - display:noneor visibility:hiddenonly says the browser to not to show the iframe content to user.
CSS -display:none或者visibility:hidden只说浏览器不要向用户显示 iframe 内容。
But the functionality will work fine without any issues.
但是该功能可以正常工作，没有任何问题。
回答by Niet the Dark Absol
As far as I am aware, it should work fine. I've been using hidden iframes to load stuff for a while and haven't had any issues.
据我所知，它应该可以正常工作。我一直在使用隐藏的 iframe 来加载东西，但没有遇到任何问题。
That said I know that some browsers try to be efficient by not loading images that are hidden, so it's possible that some browsers (particularly mobile ones) do the same with iframes.
也就是说，我知道有些浏览器试图通过不加载隐藏的图像来提高效率，因此某些浏览器（尤其是移动浏览器）可能会对 iframe 执行相同的操作。
