📌  相关文章
📜  HTML 中“no-js”类的用途是什么？(1)

📅  最后修改于: 2023-12-03 15:01:16.068000             🧑  作者: Mango

HTML 中“no-js”类的用途是什么？

在 HTML 中，“no-js”类通常用于检测用户的浏览器是否支持 JavaScript，如果不支持，则会加上“no-js”类，以便开发者根据浏览器是否支持 JavaScript 来采取相应的措施，比如显示默认样式或者提示用户启用 JavaScript。

下面是一个例子：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>no-js demo</title>
  <script>
    document.documentElement.className = document.documentElement.className.replace('no-js', 'js');
  </script>
  <style>
    .header {
      font-size: 30px;
      color: red;
    }

    .no-js .header {
      font-size: 20px;
      color: blue;
    }
  </style>
</head>
<body>
  <header class="header">Hello, world!</header>
</body>
</html>

在这个例子中，我们设置了一个默认的样式，即 .header 的字体大小为 30px，颜色为红色。同时，我们也设置了一个针对不支持 JavaScript 的样式，即 .no-js .header 的字体大小为 20px，颜色为蓝色。

当用户的浏览器不支持 JavaScript 时，会加上“no-js”类，此时应用的样式就是 .no-js .header，当用户的浏览器支持 JavaScript 时，会将“no-js”类替换成“js”类，此时应用的样式就是 .header。

这个例子只是展示了“no-js”类的一个简单用法，在实际开发中，“no-js”类还有很多其他的用途，比如检测浏览器是否支持某些 HTML5 特性或者 CSS3 属性等等。开发者可以根据自己的需求灵活运用。