Get the latest tech news
Hiding elements that require JavaScript without JavaScript
I’ve tried my best to make sure that this site works great (or at least reasonably well) even without JavaScript, but when JavaScript isn’t available, it can be a little clunky to hide things that do require it. With a mere 7 lines (or a one-liner if you’re nasty), you can easily hide elements that require JavaScript so that you don’t end up with broken functionality visible to users who have JavaScript off.
It results in needing to create two CSS rules for each element, and for my goal of just hiding things when JavaScript isn’t enabled, that seems heavy handed. In your site’s header, you can simply link all of your CSS as you normally would, and then add the following snippet to override the fields that you want to not show when JavaScript is disabled. We’ll simply create a single class, d-js-required to indicate that JavaScript needs to be enabled for us to display this element.
Or read this on Hacker News