How to set alternate content for users that do not support client-side scripts ?

How can JavaScript codes be hidden from old browsers that do not support JavaScript ?

Last Updated : 17 Feb, 2022

Nowadays all modern browsers support JavaScript, however, older browsers did not support JavaScript. In this article, we will learn how we can hide JavaScript code from running in older browsers.

Approach: After opening the <script> tag, we will use a one-line HTML style comment without any closing character (  ) before we close the script with the </script> tag.

Syntax:

<script>
    <!--
         // Your JavaScript code
         // that is hidden from older browser
         
         console.log("Hello Geeks");
    //-->
</script>

Example: In this example, the background color will be changed to red if the browser supports JavaScript, else it will remain yellow.

HTML

<!DOCTYPE html>
<html lang="en">
<body bgcolor="yellow">
    <h1 style=
        "text-align: center;
         font-size: 3rem;">
      Hello Geeks
    </h1>
    <script type="text/javascript">
        <!--
            document.bgColor ="red";
        //-->
    </script>
</body>
</html>

Output: We can see that the old browser will ignore JavaScript code and will treat JavaScript code as an HTML comment, but modern browser easily access JavaScript code and will not create any problem.

When the browser does not support JavaScript:
When the browser supports JavaScript:

Note: If the IDE gives a syntax warning using the above approach, we can add a JavaScript comment before the first HTML style comment to prevent it from doing so.

<script>
 //<!--
    // Your JavaScript code
     // that is hidden from older browser
         
     console.log("Hello Geeks");
 //-->
</script>

How to set alternate content for users that do not support client-side scripts ?

torq1284

Improve

Article Tags :

Similar Reads

How to find whether browser supports JavaScript or not ?

We will discuss how to find whether our Browser supports JavaScript or not. For this, we need to use the <noscript> tag, which defines an alternate text to be displayed to users who have disabled <script> tag in their Browsers. Since JavaScript is written inside <script> tag in HTM

How are the JavaScript window and JavaScript document different from one another?

What is a JavaScript window? The window is at a root/top level at the JavaScript object hierarchy. It is a global/root object in JavaScript and it is the root object of the Document object model(DOM); What is a JavaScript document? A document is an object inside the window object and we use a docume

How to check if CSS property is supported in browser using JavaScript ?

Few CSS properties are not supported in some browsers, thus it is required to check whether a CSS property & its value are supported in the current browser. We can find it using JavaScript using CSS.supports() method. Syntax: supports(propertyName, value) supports(condition) There are two distin

How to set alternate content for users that do not support client-side scripts ?

In this article, we define an alternate content for users that do not support client-side scripts by using <noscript> tag in the HTML document. It is used to display the text for those browsers that does not support script tag or the browsers disable the script for the user. Syntax: <noscri

How to detect HTML 5 is supported or not in the browser ?

HTML 5 is the latest standard of HTML that includes many new changes and features. HTML 5 support can be detected by using three approaches:Method 1: Checking for Geolocation support: The Geolocation API was added in HTML5. It is used for identifying the user's location. The presence of this API cou

How to detect browser or tab closing in JavaScript ?

Detecting browser or tab closure in JavaScript is essential for preventing data loss or unintended navigation. Using the beforeunload event, developers can prompt users with a confirmation dialog, ensuring they don't accidentally leave a page with unsaved changes or important information. The before

How to detect HTML <canvas> is not Supported by JavaScript?

To detect if the HTML5 <canvas> element is supported by JavaScript, the existence of the getContext method is checked. This method is essential for rendering graphics on the canvas.Approach: Using getContext() methodThe getContext() method retrieves the drawing context of a canvas element and

JavaScript Cheat Sheet - A Basic Guide to JavaScript

JavaScript is a lightweight, open, and cross-platform programming language. It is omnipresent in modern development and is used by programmers across the world to create dynamic and interactive web content like applications and browsersJavaScript (JS) is a versatile, high-level programming language

How to run JavaScript in Chrome Browser ?

Javascript is a highly flexible scripting language that enables developers to incorporate interactive elements into web pages. Web development could not be imagined without it as one of the most widely used methods to implement JavaScript is via web browsers. One of the very popular web browsers is

How to check the current runtime environment is a browser in JavaScript ?

In this article, we will see how to detect the runtime environment in which our JavaScript code is running. Suppose you are building an application in Node.js and need to include that code in a webpage that would be run on a browser. This would cause some functions of a Node application not to work