Javascript [Electronic resources] : The Definitive Guide (4th Edition) نسخه متنی

20.3 Compatibility with Non-JavaScript Browsers

The
previous section discussed compatibility with browsers that do not
support a particular version of JavaScript. This section considers
compatibility with browsers that do not support JavaScript at all.
These are either browsers that have no JavaScript capability or
browsers in which the user has disabled JavaScript (which some users
do because of security concerns). Because a number of such browsers
are still in use, you should design your web pages to fail gracefully
when read into browsers that do not understand JavaScript. There are
two parts to doing this: first, you must take care to ensure that
your JavaScript code does not appear as if it were HTML text; and
second, you should arrange to display a message informing the visitor
that her browser cannot correctly handle the page.

20.3.1 Hiding Scripts from Old Browsers

Web browsers that support JavaScript execute the JavaScript
statements that
appear between the

<script>
and </script> tags. Browsers that
don't support JavaScript but recognize the
<script> tag simply ignore everything
between <script> and
</script>. This is as it should be. Really
old browsers, however (and there are still some out there), do not
even recognize the <script> and
</script> tags. This means that they ignore
the tags themselves and treat all the JavaScript between them as HTML
text to be displayed. Unless you take steps to prevent it, users of
these old browsers see your JavaScript code formatted into big
meaningless paragraphs and presented as web page content!

To prevent this, enclose the body of
your script within an HTML comment, using the format shown in Example 20-4.

Example 20-4. A script hidden from old browsers

<script language="JavaScript">
<!-- Begin HTML comment that hides the script
// JavaScript statements go here
//              .
//              .
// End HTML comment that hides the script -->
</script>

Browsers that do not understand the <script>
and </script> tags simply ignore them. Thus,
lines one and seven in Example 20-4 have no effect on
these browsers. They'll ignore lines two through six as well,
because the first four characters on line two begin an HTML comment
and the last three characters on line six end that
comment -- everything in between is ignored by the HTML parser.

This
script-hiding technique also works for browsers that

do support JavaScript. Lines one and seven
indicate the beginning and end of a script. Client-side JavaScript
interpreters recognize the HTML comment-opening string
<!-- but treat it as a single-line comment.
Thus, a browser with JavaScript support treats line two as a
single-line comment. Similarly, line six begins with the
//
single-line comment string, so that line is ignored by
JavaScript-enabled browsers as well. This leaves lines three through
five, which are executed as JavaScript statements.

While it takes a little getting used to, this simple and elegant mix
of HTML and JavaScript comments does exactly what we need: it
prevents JavaScript code from being displayed by browsers that do not
support JavaScript. Although a declining number of browsers require
this type of commenting, it is still quite common to see it used in
JavaScript code on the Internet. The comments need not be as verbose
as in Example 20-4, of course. It is common to see
scripts like this:

<script language="JavaScript">
<!--
document.write(new Date(  ));
// -->
</script>

This commenting technique has solved the problem of hiding our
JavaScript code from browsers that can't run it. The next step
in failing gracefully is to display a message to the user to let him
know that the page cannot run.

20.3.2 <noscript>

The
<noscript> and
</noscript> tags enclose an arbitrary block
of HTML text that should be displayed by any browser that does not
support JavaScript. These tags can be employed to let a user know
that his browser cannot correctly display your pages that require
JavaScript. For example:

<script language="JavaScript1.1">
// Your JavaScript code here
</script>
<noscript>
<hr size="4">
<h1>

This Page Requires JavaScript 1.1</h1>
This page requires a browser that supports JavaScript 1.1.<p>
Your browser either does not support JavaScript, or it has JavaScript
support disabled. If you want to correctly view this page, please
upgrade your browser or enable JavaScript support.

</h1>
<hr size="4">
</noscript>

There is one problem with the <noscript>
tag. It was introduced into HTML by Netscape with the release of
Netscape 3. Thus, it is
not supported in
Netscape 2. Since Netscape 2 does not support
<noscript> and
</noscript>, it ignores the tags and
displays the text that appears between them, even though it does
support scripting. In the previous code, however, this works out to
our advantage, because we've specified that the code requires
JavaScript 1.1 support.