<noscript>标签不起作用
[英]<noscript> tag not working
问题描述
我使用<noscript>标记在未启用 javascript 时隐藏某些元素； 但是，它似乎不起作用。
我的文件声明：
<!DOCTYPE html>
在我的文件末尾，我输入了以下内容：
<noscript>
<style type="text/css" scoped> #status {display:none;} </style>
</noscript>
</body>
</html>
但是即使在禁用 JS 之后，#status div 仍然存在。 我在这里错过了什么吗？
5 个解决方案
解决方案1
11 已采纳 2013-06-21 15:03:04
移除style标签的scoped属性。 它使您的 CSS 严格应用于<noscript>标签。
如果此属性存在，则样式仅适用于其父元素。
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style#Attributes
解决方案2
5 2013-06-21 15:03:35
一个更简单的管理解决方案是默认隐藏元素并使用它：
<script>document.getElementById('status').style.display='block';</script>
（或等效的基于类的解决方案）
解决方案3
0 2013-06-21 16:26:03
尝试删除style的scope ，如下面的代码。
<noscript>
<style type="text/css"> #status {display:none;} </style>
</noscript>
解决方案4
0 2013-08-05 15:27:38
@dystroy 的回答是正确的做法，因为：
-
<style>元素不能放在<body>（除非它们有scoped属性） -
<noscript>元素不能放在头上。
但是如果你不想延迟，你可以在<head>使用以下内容：
<style id="noScriptSheet" type="text/css">
.onlyScript{ display:none;}
</style>
<script type="text/javascript">
function kill(el){
return el.parentNode.removeChild(el);
}
kill(document.getElementById('noScriptSheet'));
</script>
并向您的元素添加一个类：
<div class="onlyScript">Hello world!</div>
演示： http : //jsfiddle.net/TQLfu/
解决方案5
0 2020-09-02 20:07:58
我添加这个答案是因为这似乎是关于noscript标签的最流行的 SO 问题。
它似乎根本不会被"Sybu JavaScript Blocker" 触发。 因此，如果您正在使用该 JavaScript 阻止程序进行测试，请尝试使用另一个 JavaScript 阻止程序。 当我使用“Toggle Javascript”时， noscript标签毫无问题地被触发。 我还没有发现一种方法来检测正在使用“Sybu JavaScript Blocker”。
我的测试环境：
- Sybu JavaScript 拦截器，版本 2.93
- 切换 JavaScript，版本 1.3
- Chrome，版本 85.0.4183.83
Noscript标签在iPad和iPod上不起作用
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.