[英]<noscript> tag not working
I've used the <noscript>
tag to hide certain elements when javascript is not enabled;我使用
<noscript>
标记在未启用 javascript 时隐藏某些元素; however, it doesn't seem to work.但是,它似乎不起作用。
My document declaration:我的文件声明:
<!DOCTYPE html>
At the end of my file I typed the following:在我的文件末尾,我输入了以下内容:
<noscript>
<style type="text/css" scoped> #status {display:none;} </style>
</noscript>
</body>
</html>
But the #status div is still present even after disabling JS.但是即使在禁用 JS 之后,#status div 仍然存在。 Am I missing something here?
我在这里错过了什么吗?
Remove the scoped
attribute of the style
tag.移除
style
标签的scoped
属性。 It's making your CSS apply strictly to the <noscript>
tag.它使您的 CSS 严格应用于
<noscript>
标签。
If this attribute is present, then style applies only to its parent element.
如果此属性存在,则样式仅适用于其父元素。
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style#Attributes https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style#Attributes
A simpler to manage solution would be to make the element hidden by default and use this :一个更简单的管理解决方案是默认隐藏元素并使用它:
<script>document.getElementById('status').style.display='block';</script>
(or an equivalent class based solution) (或等效的基于类的解决方案)
Try removing the scope
of the style
, like the code below.尝试删除
style
的scope
,如下面的代码。
<noscript>
<style type="text/css"> #status {display:none;} </style>
</noscript>
@dystroy's answer is the right way of doing it, because: @dystroy 的回答是正确的做法,因为:
<style>
elements can't be placed on <body>
(except if they have scoped
attribute) <style>
元素不能放在<body>
(除非它们有scoped
属性)<noscript>
elements can't be placed on head. <noscript>
元素不能放在头上。 But if you don't want a delay, you can use the following in <head>
:但是如果你不想延迟,你可以在
<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>
And add a class to your element:并向您的元素添加一个类:
<div class="onlyScript">Hello world!</div>
Demo : http://jsfiddle.net/TQLfu/演示: http : //jsfiddle.net/TQLfu/
I am adding this answer because this seems to be the most popular SO-question regarding the noscript
tag.我添加这个答案是因为这似乎是关于
noscript
标签的最流行的 SO 问题。
It doesn't seem to fire at all with "Sybu JavaScript Blocker" .它似乎根本不会被"Sybu JavaScript Blocker" 触发。 So in case you are testing with that JavaScript blocker try using another JavaScript blocker .
因此,如果您正在使用该 JavaScript 阻止程序进行测试,请尝试使用另一个 JavaScript 阻止程序。 When I used "Toggle Javascript" the
noscript
tag fired without problem.当我使用“Toggle Javascript”时,
noscript
标签毫无问题地被触发。 I did not yet discover a way to detect that "Sybu JavaScript Blocker" is being used.我还没有发现一种方法来检测正在使用“Sybu JavaScript Blocker”。
My Testing environment:我的测试环境:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.