Javascript Tutorial -- Handling Browsers That Do Not Support Javascript



In Lesson 10, we discussed the problem of browser incompatibility, and showed you some techniques to mitigate this problem. But that's not enough. You know that not every browser supports Javascript, and even among the browsers that do, some users have disabled Javascript due to security concerns. Since you are a perfectionist, it is not acceptable for visitors who are not or cannot use Javascript to find a web page without the appropriate content -- or worse yet, no content at all; you want a web page that will fail gracefully when Javascript is not available on a web browser. You want your web page to produce output that alerts the user to the fact that Javascript is required for the full impact of the web page that you have worked so hard to create.

Javascript cannot help you, this time. Since the web browser must run Javascript for Javascript to take any action, you would have a "chicken-or-the-egg" situation if you tried to employ Javascript to solve this problem. But all is not lost. In this case, the answer comes in the form of an HTML tag called the "<noscript>" tag. The <noscript> tag encloses content that is displayed in the web browser only in the event that the browser does not support Javascript. If Javascript is available, everything between the <noscript> tag and the </noscript> tag is silently ignored. Here's a simple HTML document that will display one message in the web browser if Javascript is available and will display a suitable warning message if it is not:
        <html>
          <head>
            <title>
              Example 11
            </title>
            <script type="text/javascript"
              <!--
                document.write('Content generated by Javascript')
              //-->
            </script>
          </head>
          <body>
            <noscript>
              Warning: this page requires Javascript
            </noscript>
          </body>
        </head>
      
Here is how the above script (more or less) looks on the web. Hint: try enabling and disabling Javascript in your browser, then reloading the web page.