Introduction
JavaScript is a scripting language
designed and first implemented by Netscape (with help from Sun Micro systems).
Netscape first introduced a JavaScript interpreter in Navigator 2. The
interpreter was an extra software component in the browser that was capable of
interpreting JavaScript source code inside an HTML document. This meant that Web
page authors using no more than a simple text editor could place special
instructions or programs directly inside Web pages to make them more dynamic
and interactive. For example, JavaScript can be used to:
- validate user input in an HTML form before sending the data to a server;
- build forms that respond to user input without accessing a server;
- change the appearance of HTML documents and dynamically write HTML into separate Windows;
- open and close new Netscape windows or frames;
- manipulate HTML "layers" including hiding, moving, and allowing the user to drag them around a browser window;
- build small but complete client side programs.
The definition of the JavaScript
language and the ability of the Netscape browser (and others..) to process it
are still evolving. As the language grows, and Netscape, Microsoft, and others
issue new versions of their browsers, programmers are discovering new and
exciting things they can do with JavaScript and Web pages.
Advantages of JavaScript
JavaScript gives web authors an
unprecedented degree of control over the behavior of Netscape and the behavior of their documents. You can do things with 20 lines of JavaScript
that will significantly reduce the load on your server, give the user better
feed back, and enhance the appearance of your web pages. JavaScript is often
the most efficient solution to many Web authoring problems. JavaScript is also
an easy language to get started using. With little more than a text editor a
few helpful websites and some interest it is possible to produce some but
useful scripts.
Disadvantages of JavaScript
The first browser that reliably
implemented JavaScript was Netscape 2.02. Since then, new features have been
added to the language and have been supported by later versions of Netscape's
browsers. Different versions of Netscape will behave differently depending on
the language features you use. It is possible to write JavaScript programs that
use advanced JavaScript features but do not cause problems (JavaScript errors)
on older browsers. However, doing this is can be a complex and labor intensive
process. Unfortunately, even the same version of Netscape may behave
differently depending on the operating system it is run on. The language is
very new and still evolving. Few software development tools exist to help you
write and debug your scripts. And while you can do a lot with JavaScript, some
things like animation, scrolling/animated banners and notices, and complex
programming are often better done using animated GIFs, Netscape Plugins such as
Flash, or Java applets.
To make matters more complicated,
Microsoft's support for JavaScript (they call it Jscript) in Internet Explorer
has been evolving at a different pace than Netscape's. And while Microsoft has
done a reasonable job of implementing the JavaScript language they have decided
to introduce differences in how the language interacts with the more recent and
advanced methods for manipulating Web pages and responding to user input loosely
referred to as dynamic HTML. The growing market share of Internet Explorer and
these differences have made it difficult for anyone to reliably use the more
advanced features of dynamic HTML on the Web.
From a scripter's perspective this
situation is quite discouraging. It will take a number of years before a
standard for dynamic HTML/JavaScript is in place and the vast majority of the
browsers on the Web completely support the standard. Also bad is the fact that
so many of the different browser versions have serious bugs in how JavaScript
interacts with HTML objects. Documenting these and working out code work around could easily occupy a small group of people full time.
The
Difference Between HTML and JavaScript
When the browser is reading in an
HTML document it needs to be able to determine what text is HTML and therefore
what to display in the browser window, and what text is JavaScript source code
to be interpreted and executed. One way to let a browser know that part of
an HTML document is JavaScript is to enclose it inside the HTML <SCRIPT></SCRIPT> tags as illustrated above. A browser that knows how to
interpret JavaScript will attempt to interpret text inside the script tags
while reading and displaying HTML elements correctly.
Script tags are most often placed
inside the head or body tags but may also be placed inside other elements. Not
every version of every browser correctly interprets JavaScript code when script
tags are placed inside other HTML elements such as table data cells.
JavaScript
Statements and Source Code
The JavaScript text is often
referred to as "source code" or just "code" and is made up
of statements. In the example above these two JavaScript statements:
document.write("<P>Script
tags can be placed ")
document.write("in
the Head of an HTML document.</P>")
write some text, consisting of an
HTML paragraph, into the Web page being loaded by the browser. The first
statement writes the first half of the paragraph and the second writes the last
half. A full description of the parts of these statements is provided later but
the net effect is to make the text:
<P>Script
tags can be placed in the Head of an HTML document.</P>
part of the HTML document. Use the
View Page button above to see what happens when you load a page containing this
script into a Web browser.
Simple
Statements
Here is a simpler JavaScript
statement:
a
= 2 + 3
The JavaScript interpreter will read
in this line of text (or source code) and interpret it. The first thing it will
do is evaluate the right hand part of the statement after the " =
". This is the expression 2 +
3 which the interpreter will evaluate
to the number 5. The next thing it will do is place the number 5
in the variable named a.
On its own, adding two plus three to
get five and storing this number in a storage location named a
is not very exciting. But it does give an example of a simple JavaScript
statement that contains a simple expression. Statements can be more complicated
and we will often need to look closely at the expressions within them.