Embedding JavaScript
Embedding JavaScript into your
HTML document
Browsers that recognize
JavaScript also recognize the
special <SCRIPT> ... </SCRIPT>
tag. This tag goes in the <HEAD>
of your HTML document, along with
your <TITLE> tag. Here's a short
example:
<HTML> <HEAD> <TITLE>My JavaScript
Page</TITLE> <SCRIPT> (JavaScript
code goes in here)
</SCRIPT> </HEAD> (rest of your
HTML document goes here)
To make an object (such as an
image, a form button, or a
hyperlink) on your page do
something in response to a user
action, you can add an additional
attribute to the tag for that
object. For example, the following
HTML snippet pops up a thank you
message when the user clicks on
the link:
<A HREF="http://www.codeteller.com/"
onClick="alert('Thanks for
visiting the Bridge home page!')">Codeteller
home page</A>
You're familiar with the HREF=""
attribute that specifies the URL
that the link points to, but note
the additional onClick=""
attribute. The stuff between those
quotation marks is JavaScript
code, which in this case pops up
an alert box with the specified
message. (Don't worry if you don't
understand the stuff between the
quotation marks; you'll learn it
later on. The important thing
right now is to understand the
additional attribute.)
Another point to recognize is
that if a browser does not
understand the <SCRIPT> tag, it
will skip over it, and the text
that is between the two tags (your
code, basically) will appear on
the screen as ordinary text. Since
you want to create an HTML page
that is viewable on all browsers,
you would want to prevent this
from happening.
To prevent this from happening,
you should include the characters
<!-- immediately following the
<SCRIPT> tag and the characters
--> immediately preceding the
</SCRIPT> tag. In HTML in general,
using this set of characters
allows you to write comments to
yourself that the browser will not
read or display on the page.
Inside the JavaScript tags, the
browser ignores these characters.
By doing this, a non-JavaScript
readable browser will see the
comment notation and ignore the
text between them (which is your
code). Your code would then look
like this:
<HEAD>
<SCRIPT>
<!--
(Your code goes here...)
-->
</SCRIPT>
</HEAD>
|