使用.no-js类检测js

Question

使用.no-js类检测js

ccd*_*ies 5 javascript css css3 modernizr

我一直使用在<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

jma*_*777 9

保罗爱尔兰有一篇关于处理这个问题的优秀博客文章.这是该帖子的解决方案:

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

Run Code Online (Sandbox Code Playgroud)

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

Answer 2

Poi*_*nty 5

您可以在以下顶部添加一个简短的脚本<head>:

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

Run Code Online (Sandbox Code Playgroud)

另外,请不要忘记在<noscript>启用JavaScript时忽略的标记.

归档时间：	12 年，8 月前
查看次数：	4754 次
最近记录：	12 年，8 月前