我有一个常见问题，我有一个用 HTML、CSS 和 JQuery 完成的网页。当页面开始加载时，它首先加载 html 并显示 div 秒，这些 div 应该被 css 和 jquery 隐藏。但一秒钟后，它看起来很完美。但是第一秒看起来很糟糕。我怎样才能避免这种情况？
问问题
8120 次
4 回答
5
我没有这样的经验，但我认为脚本的加载过程在这里应该有所帮助。根据页面的用途（我不知道），我更喜欢您尝试以这种方式加载。
使用 CSS 显示 div
<div style="display: none;">Hidden by default</div>
在你的 body 标签关闭之前加载你的 JQuery 文件。
当页面完全加载时，它可以正常运行。
于 2013-03-16T11:35:59.387 回答
4
$(this).hide();或$(this).addClass('.hidden');总是比.class { display:none; }
jQuery 必须等待 DOM 加载。CSS没有。设置您的 CSS 以隐藏加载时需要隐藏的元素，然后使用 jQuery 显示这些元素。
于 2013-03-16T11:34:59.447 回答
2
一个肮脏的解决方案是内联 css：
<div style="display: none;">This will be hidden</div>
更好的解决方案是使用 javascript 按需构建这些元素。
于 2013-03-16T11:24:02.527 回答
2
如果您希望您的 css 更快地呈现，最好将隐藏 css 语句移动到它们自己的小文件中，或者更好地将隐藏 css 实际添加到<style>页面上的标签中。这意味着它们几乎立即被渲染。
关于 jQuery——正如 Scott 所提到的——你能期望的最快的就是在dom ready. 如果您正在等待窗口加载，这将更慢。使用纯 javascript，您可以在页面中需要隐藏的元素之后放置脚本标签。然后，您可以直接使用它们来定位它们并将它们doument.getElementById设置display为none，而无需等待页面准备就绪。
于 2013-03-16T11:42:22.830 回答