Question

我想在我的页面顶部添加粘贴的文本（当用户下载页面时文本会发生故障等），当有人没有启用JavaScript时，就像这样：

enter image description here

怎么做？有没有办法使用JavaScript或HTML？我不想使用jQuery，因为我不太懂那种语言。

@EDIT：抱歉，这是我的错误 - 如果用户没有启用JS，则无法使用JavaScript：）

Answer 1

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div id="no_js_header">test</div>
  <div id="content">content</div>
  <div style="margin-top: 2200px"></div>
</body>
</html>

#no_js_header {
    position:fixed;
    width:100%;
    background-color:red;
    margin: 0px;
    top: 0px;
    left: 0px;
    padding: 3px;
}

#content {
  position: absolute;
  top: 50px;
}

（取消注释jsbin中的激活）

document.getElementById('no_js_header').style.display = 'none';

Answer 2

这是一个如何制作类似SO的信息栏的示例：

HTML：

<noscript><div id="noscript"><p>NO JAVASCRIPT</p></div></noscript>

CSS：

div#noscript {

    margin: 0 auto; 
    width: 100%; 
    padding: 10px 0; 
    position: fixed; 
    top: 0; 
    background: red;
    z-index: 99999;
}

div#noscript p { 

    text-align: center;
    color: white;
}

这里是JSfiddle

Answer 3

您可以尝试使用noscript标签...

<noscript>
    <div>
        <p>ahhh, javascript is disabled!</p>
    </div>
</noscript>

粘贴在页面顶部的文本

3 个答案: