正确渲染最初隐藏的HTML元素的方法

Question

我多年来在我的HTML中使用类似这样的元素应隐藏的元素:

<div style="display: none"></div>

没关系,但我不能再忍受内联风格了.

1. 在JavaScript window.onload事件中以编程方式隐藏元素为时已晚 - 它将在屏幕上闪烁.

2. 我可以创建CSS类'隐藏',但是使用浏览器的激进加载策略(比如在Opera中),该块可能会出现一秒钟(在加载CSS之前).

有没有更好的方法？

Answer 1

据我所知,该class="hidden"方法是最好的和最常用的方法.我建议你用class="hidden".

"但是使用浏览器的激进加载策略(比如在Opera中),该块可能会出现一秒钟(在加载CSS之前)."

我不使用Opera,但是如果任何浏览器在应用样式之前加载了页面,那么很多东西看起来都不对,而不仅仅是你的隐藏元素.我不知道有任何浏览器这样做.

Answer 2

我最近开始使用节点对象,我越来越喜欢这种方法.这样您就不必使用隐藏的HTML元素,只需放置一个锚点即可:

<a name="some-anchor" id="some-anchor-id" />

然后用创建的节点替换它.这样您就不必担心加载时闪烁的元素,因为不会有任何元素闪烁.