Menu
In HTML webpage, the content within noscript tags are not getting rendered by browsers with script blocking extension.
I have a page
http://www.zen76171.zen.co.uk/aaa2.html
with this HTML
<!doctype html>
<html>
<head>
<noscript>aaa</noscript>
<script>document.write("bbb")</script>
</head>
<body>
ccc
</body>
</html>
I understand that the contents of the noscript tag should run if a browser is not running javascript.
In chrome or firefox, with no extensions blocking anything, I get the output of bbb ccc. That's fine, that makes sense. 'bbb' shows because javascript is allowed, and ccc shows because it will show whether javascript is enabled or not.
If I install e.g. the uBlock origin extension or if in Firefox I install the NoScript extension(note- the name of that extension is coincidentally the same as the noscript tag), then when I reload the page I mentioned
http://www.zen76171.zen.co.uk/aaa2.html
It shows ccc. That indicates to me that scripts are being blocked (as it didn't show bbb, so that part(not showing bbb, is good.
But the output I would expect is aaa ccc, because I'd expect 'aaa' to show when scripts are disabled, and scripts are disabled.
There is also a secondary problem that I work around, which is that if I disable or even 'remove' the NoScript extension from Firefox, then I still get the same response of 'ccc', I have to uninstall and reinstall Firefox to remove the NoScript extension. But for now that will do when I want to remove the NoScript extension. uBlock Origin has no such issue(don't need to reinstall a browser to remove it!). So if anybody tries to reproduce this problem then I suggest they either use the script blocker they have, or as I have, use uBlock Origin.
Why does it show just 'ccc' and not 'aaa ccc' (when scripts are blocked)?
This is the case with uBlock Origin, or with the NoScript extension. So, it seems, it's with anything that disables scripts.
So, why is the aaa not being displayed ever. I'd think it should be displayed when scripts are disabled.
628
It only works, if the <noscript> is in the body, not the head. And it's absolutely correct that it behaves like that. Just think of setting any content inside the <head>: it won't get displayed.
Won't work: <noscript> in <head>
<!doctype html>
<html>
<head>
<noscript>aaa</noscript>
<script>document.write("bbb")</script>
</head>
<body>
ccc
</body>
</html>
Tested with latest Chrome and uBlock Origin extension on Windows 10 Pro on this codepen
Will work: <noscript> in <body>
<!doctype html>
<html>
<head>
</head>
<body>
<noscript>aaa</noscript>
<script>document.write("bbb")</script>
ccc
</body>
</html>
Tested with latest Chrome and uBlock Origin extension on Windows 10 Pro on this codepen
On MDN <noscript> page it says (emphasis mine)
Permitted content: When scripting is disabled and when it is a descendant of the <head> element: in any order, zero or more <link> elements, zero or more <style> elements, and zero or more <meta> elements. When scripting is disabled and when it isn't a descendant of the <head> element: any transparent content, but no <noscript> element must be among its descendants. Otherwise: flow content or phrasing content.
So: If in head, only link, meta and style allowed
173
Script blocking extensions generally work by blocking the script elements. They don't disable JavaScript support in the browser.
Since the browser itself has JS support enabled, it doesn't render noscript elements.
Use progressive enhancement instead. Start with the content for browsers where the JS doesn't work, then change it with JS.
Array.from(
document.querySelectorAll(".nojs")
).forEach(
node => node.remove()
);<span class="nojs">aaa</span> cccIf you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
