How do you detect if JavaScript is disabled?

HTML

The short answer

Use the <noscript> HTML tag. Content inside <noscript> only displays when JavaScript is disabled. You can use it to show a message, load alternative styles, or redirect users to a non-JavaScript version of your site.

The noscript tag

<noscript>
  <p>
    This website requires JavaScript to function. Please
    enable it in your browser settings.
  </p>
</noscript>

If JavaScript is enabled, the user never sees this message. If JavaScript is disabled, the message appears.

Common uses

Show a warning:

<noscript>
  <div
    style="background: #fff3cd; padding: 16px; text-align: center;"
  >
    JavaScript is required for this app to work.
  </div>
</noscript>

Load alternative styles:

<noscript>
  <link rel="stylesheet" href="no-js-styles.css" />
</noscript>

Redirect to a simple version:

<noscript>
  <meta
    http-equiv="refresh"
    content="0; url=/simple-version"
  />
</noscript>

CSS approach

You can also use a CSS class to detect JavaScript:

<html class="no-js">
  <script>
    document.documentElement.classList.replace(
      'no-js',
      'js'
    );
  </script>
</html>
.no-js .interactive-widget {
  display: none;
}
.js .static-fallback {
  display: none;
}

If JavaScript runs, it replaces no-js with js. If it does not run, the no-js class stays and you can style accordingly.

Interview Tip

The <noscript> tag is the simplest answer. Mention the CSS class technique as a more flexible alternative. This is a quick question — keep it brief.

Why interviewers ask this

This tests your knowledge of progressive enhancement and graceful degradation. While most users have JavaScript enabled, knowing how to handle the case when it is disabled shows you think about edge cases and accessibility.

Table of Contents