Question

我一直使用<html>标签上有一类.no-js的方法，然后使用剥离标签的modernizr，如果在用户的浏览器中启用了JavaScript，则用js替换它。

基本上，我已经构建了一个CSS3移动和桌面导航。我有样式来改变它的行为，如果有CSS转换等（用modernizr检查）以及是否有js或no-js。

问题是，在JavaScript有时间加载并将类更改为js之前，我得到了一个no-js版本的flash。（因为默认类是no-js）

我无法理解的是如何找到解决方法。如果我将js特定代码作为主类，则使用前缀.no-js指定另一个，即使启用了js，它也会闪烁no-js。如果我将其切换，它也会这样做......

也许我是愚蠢的，但任何指针都会很棒。

Answer 1

保罗爱尔兰人有excellent blog post处理这个问题。这是该帖子的解决方案：

<!DOCTYPE html>
<html lang='en' class='no-js'>
    <head>
        <script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
        ...

关键是要确保在浏览器有机会渲染任何内容之前更新了类名。

Answer 2

您可以在<head>：

的最顶部添加一个简短的脚本

<script>
  document.documentElement.className =
    document.documentElement.className.replace('no-js', 'js');
</script>

另外请不要忘记<noscript>标记，在启用JavaScript时会忽略该标记。

使用.no-js类检测js

2 个答案: