隐藏 div 会加载信息吗？答案

【问题标题】：Does hiding a div load the information?隐藏 div 会加载信息吗？
【发布时间】：2013-06-23 05:50:07
【问题描述】：

只是想知道当我将 div 显示为隐藏时，信息是先加载然后隐藏还是在显示时才加载？不记得这些术语，但它就像 display="none" 之类的。

谢谢

【问题讨论】：

【解决方案1】：

这个问题和你的类似。 Does display:none keep elements from loading?

与您的问题相关的部分是这个 ->

不。 display: none 只会阻止元素显示；它仍然会被加载。

您可以在您选择的元素检查器中看到这种情况发生（例如在 Firebug 或 IE8 的开发工具中）。

最好的方法可能是使用 JavaScript 创建 Video 元素之后，或者 - 如果您想要一个故障安全解决方案以防 JS 被打开关闭 - 如果用户点击，您可以使用加载视频的 iframe 一个链接。

希望有帮助！

【讨论】：

【解决方案2】：

它仍然会被加载到 DOM 中，但浏览器不会显示它，因为有隐藏它的提示。只需使用像 IE 开发者工具这样的 DOM 检查器来检查它，你会看到它带有display:none

【讨论】：

【解决方案3】：

您可以使用几种 CSS 样式来隐藏信息以防止显示。

display: none 和 visibility: hidden

它们实际上都会加载 DOM 内容，但不会显示它们。visibility: hidden 在布局中相应地占用该 DOM 元素所需的空间，即使它不显示元素。但是display: none 认为该元素不存在于 DOM 中，并且不占用该元素对应的 DOM 中的任何空间。

请看这个：http://jsfiddle.net/JSWorld/ADSmc/

【讨论】：