1.7 JavaScript and Old or Disabled Browsers

1.7.1 Hiding JavaScript from Old Browsers

There are many versions of browsers available to the public and 99 percent of the public uses Netscape or MSIE. So why worry? Well, just because a browser supports JavaScript, does not mean that everyone has JavaScript enabled. There are also some older text browsers that don't support JavaScript and with the advent of cell phones and Palm handhelds providing browser support but not JavaScript, there has to be some alternative way to address those Web browsers that do not have JavaScript. (See http://www.internet.com/.)

HTML Comments

If you put a script in a Web page, and the browser is old and doesn't know what a <script> tag is, the JavaScript code will be treated as regular HTML. So if you hide the JavaScript code within HTML comments, then the old browser will ignore it. If the browser has JavaScript enabled, then any HTML tags (including HTML comments) inserted between the <script> </script> tags will be ignored. See Examples 1.3 and 1.4.

Example 1.3

 <html>     <head><title>Old Browsers</title></head>     <body><font color="0000F">         <div align=center> 1       <script language="JavaScript"  type="text/javascript"> 2  <!-- Hiding JavaScript from Older Browsers  3            document.write("<h2>Welcome to Maine!</h2>"); 4  // Stop Hiding JavaScript from Older Browsers -->  5       </script>         <img src="island.jpg" width=320 height=250 border=1>         <br>Bailey's Island     </body></html>

EXPLANATION

The JavaScript program starts here.
The  is reached. Any browser not supporting JavaScript will treat this whole block as a comment. JavaScript itself uses two slashes or C style syntax, /* */ , and will ignore the HTML comment tags.
The document.write function displays this line in the page. Any HTML tags inserted in the quoted strings will be handled by the HTML renderer. JavaScript does not know how to interpret HTML by itself. If the browser supports JavaScript, the line Welcome to Maine! will appear just above the image. If the browser does not support JavaScript, this section of code is ignored. See the two examples of output shown in Figures 1.5 and 1.6.

Figure 1.5. Example 1.3 output in a JavaScript-disabled browser.

Figure 1.6. Example 1.3 output in a JavaScript-enabled browser.
This line starts with two slashes, the start of a JavaScript comment. This is done so that if JavaScript is interpreting this section, it won't see the HTML closing comment tag, --> . Why don't we want JavaScript to see the closing tag if it could see the opening tag? Because JavaScript would see the double dash as one of its special operators, and produce an error. Netscape's error:
The JavaScript program ends here with its closing </script> tag.

Example 1.4

 <html><head><title>Enabled/Disabled Browsers</title>     <script> 1   <!--> Sorry,     <!--> you are not JavaScript enabled 2   <!-- hiding from non-JavaScript enabled browsers         document.write("Testing to see if JavaScript is turned on."); 3   // done hiding -->     </script>     <head>     <body></body>     </html>

EXPLANATION

The <!--> is like an empty HTML comment. JavaScript-enabled browsers will ignore these lines, just as they ignore the <!-- hide... line, because they begin with a comment marker. If the browser is disabled for JavaScript, this line and the next one start as empty HTML comments, causing the text that follows to be printed.
A non “JavaScript-enabled browser will see this as the start of another HTML comment, thus keeping the script section hidden.

Netscape's <noscript> Tag

Netscape Navigator 3.0 ^[4] provided a set of tags called <noscript></noscript> that enable you to provide alternative information to browsers that are either unable to read JavaScript or have disabled JavaScript. Today it's more likely that JavaScript has been disabled for security reasons or to avoid cookies than it is to find an old browser still in use. All JavaScript-enabled browsers recognize the <noscript> tag. They will just ignore whatever is between <noscript> and </noscript> . Browsers that do not support JavaScript do not know about the <noscript> tag. They will ignore the tags but will display whatever is in between. See Example 1.5.

^[4] Warning: Netscape 2.0 always displays the contents of the <noscript> tag.

Example 1.5

 <html>     <head>     <title>Has JavaScript been turned off?</title>     </head>     <body> 1   <script language = "JavaScript" type="text/javascript"> 2   <!--        document.write( "<font color='green'><h2>" ); 3      document.writeln("Your browser supports        JavaScript!</h2></font>");     // -->     </script> 4  <noscript>  <font size="+1"> 5      Please turn JavaScript on if you want to see this page!<br>        Netscape: <em>Edit/Preferences/Advanced/Scripts and        Plugins</em><br>        MSIE: <em>Tools/Internet Options/Security/Custom        Level/Scripting</em></br> 6  </noscript>  </font>     </body>     </html>

EXPLANATION

The JavaScript program starts here with the opening <script> tag.
This is an HTML comment. This hides JavaScript from JavaScript-disabled browsers until the ending comment tag.
This line is displayed on the Web page only if JavaScript is enabled.
The <noscript> tag is read by browsers that support JavaScript. They will ignore everything between the <noscript> and </noscript> tags. Disabled browsers will not recognize the <noscript> tag and thus ignore them, displaying all text that follows.
JavaScript-disabled browsers will display the message shown in Figure 1.7. These instructions help the user enable JavaScript on Netscape 6+ and IE 5+ browsers. For directions on enabling/disabling JavaScript in all versions of Netscape and IE, see http://www.lithosjigs.com/cart/enablejava.html

Figure 1.7. Output from Example 1.5.
The </noscript> tag ends here.

1.7.1 Hiding JavaScript from Old Browsers

HTML Comments

Example 1.3

Figure 1.5. Example 1.3 output in a JavaScript-disabled browser.

Figure 1.6. Example 1.3 output in a JavaScript-enabled browser.

Example 1.4

Netscape's <noscript> Tag

Example 1.5

Figure 1.7. Output from Example 1.5.