问题描述
我已经发现了很多部分答案这个问题,但没有什么似乎是一个确定的答案。对于这样一个重要的技术,我发现这有点奇怪。
I have found numerous partial answers to this question, but nothing that seems like a definitive answer. For such an important technique I find this a little strange.
我应该如何隐藏元素(使用javascript),以便在JS之前加载页面时不会短暂出现有机会隐藏他们吗?我不想让他们最初用CSS隐藏,就好像用户没有Javascript一样,他们什么也看不到。
How should I hide elements (using javascript) so that they do not appear briefly when the page loads before the JS has a chance to hide them? I don't want to set them to hidden initially with CSS as if a user doesn't have Javascript, they will see nothing.
要清楚。我不是问如何处理向没有JS的用户显示内容。这是一个完全不同的主题。我只是想要一个可靠的方式来隐藏HTML元素,然后再显示它们。
To be clear. I'm not asking how to handle displaying content to users who don't have JS. That is an entirely different subject. I just want a reliable way to hide HTML elements before they are displayed.
所以我的要求:
- HTML元素最初不使用CSS隐藏
- 如果JS可用,这些元素是隐藏的,以至于它们永远不会显示,甚至不会立即显示。这意味着将它们从装载在身体末尾的JS中隐藏出来)。
推荐答案
像VKen一样,我更喜欢使用和的结构(这是什么使用)
Like VKen, I prefer to use moderizr and Paul Irish's structure for the html
element (which is what HTML5 Boilerplate uses)
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
然后在样式表中:
.element-to-hide { display: none; }
.no-js .element-to-hide { display: block; }
工作得很好,没有闪烁的元素消失。
Works great, no flash of elements disappearing.
这篇关于在页面加载之前,显示HTML元素的正确方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!