前言
JavaScript是一种具有函数优先的轻量级，解释型或即时编译型的高级编程语言。也作为开发 Web 页面的脚本语言。
但部分浏览器为确保安全性，阻止广告/追踪等，会关闭JavaScript功能。
我们就需要提醒用户开启JavaScript获取最好的页面体验。
实现
首先，先写出一个基本的HTML页面。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check For JS</title>
</head>
<body>
</body>
</html>
然后增加提示层，主要是提示用户开启JavaScript。
<!-- Check For JavaScript -->
<div class="alert-js">
<p>啊哦，<code>JavaScript</code>似乎无法正常使用。请尝试打开<code>JavaScript</code>以获得最佳体验！</p>
</div>
现在查看页面，提示栏似乎不太好看，可以增加CSS。
@font-face{
font-family: 'Code';
src: url('https://cdn.jsdelivr.net/gh/z-cdn/Font@5d081c5/Code/SourceCodeVariable-Italic.ttf');
}
.alert-js{
background-color: #FFFF9D;
text-align: center;
}
code{
font-family: Code;
}
现在提示就变好看了些。
但是现在开启JavaScript的用户也会看见提示，所以我们要加入一些隐藏的代码。
但是，既然都没有开启JavaScript，怎么使提示隐藏呢？
其实，我们可以增加JavaScript代码，隐藏提示。而无法使用JavaScript的用户，就不会执行，也就不会隐藏。
我使用较简单的方法，直接往页面内写入CSS，并使用display: none隐藏。
document.write("<style>.alert-js{display:none;}</style>")
并在头部引入此代码，就像这样。
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check For JS</title>
<link rel="stylesheet" type="text/css" href="alert.css">
<script src="check.js"></script>
</head>
<body>
<!-- Check For JavaScript -->
<div class="alert-js">
<p>啊哦，<code> JavaScript </code>似乎无法正常使用。请尝试打开<code> JavaScript </code>以获得最佳体验！</p>
</div>
</body>
</html>
check.js
document.write("<style>.alert-js{display:none;}</style>")
alert.css
@font-face{
font-family: 'Code';
src: url('https://cdn.jsdelivr.net/gh/z-cdn/Font@5d081c5/Code/SourceCodeVariable-Italic.ttf');
}
.alert-js{
background-color: #FFFF9D;
text-align: center;
}
code{
font-family: Code;
}
测试
现在再试一试，开启JS的用户页面没有开启的提示。
关闭JS的用户显示提示。
