[Português]
[Home]
[Back]
[Help]

Ricardo's Home Page

JavaScript HelloWorld

Java
Links
Programs
Info
Guestbook

The Hello World JavaScript should show the message "Hello World" in your browser each time you load it.
Ok, this is not the most useful JavaScript one can write, but I'll try to use it to explain the basis of JavaScript.
Please take a look at the code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
 
<html>
   <head>
      <SCRIPT LANGUAGE="JavaScript">
         document.write("Hello World !!!");
      </SCRIPT>
   </head>
   <body>
   </body>
</html>

If you have previous knowledge of HTML you may notice that, beside lines 3, 4 and 5, the rest of the code seems like some HTML page skeleton.
If you don't, maybe you might want to take a look at the HTML Hello World example.
In fact, all we need to write some JavaScript is to have an HTML page to support it.
You may have noticed also, that our code is written in the head block of the HTML page.
The reason for this has to do with the way browsers supporting JavaScript behave.
They load the Head portion of you HTML page and record it, and then load and immediately process the Body of the page.
Only after the all body of the page is processed, the commands at the head portion of the page get the chance to processed.
We use this property to guarantee that all the page has been loaded before we start our script.
This is not necessary in this simple example, but it is a good practice anyway.

So, let's take a look on the example.
We start (at line 3) with the tag <SCRIPT LANGUAGE="JavaScript">.
Of course we have the corresponding ending tab </SCRIPT> at line 5.
This tag is mandatory and must surround any JavaScript code we want to write.
Like any other HTML tag it must start with a lesser than sign, followed by a tag name and a greater than sign (<SCRIPT>) and must be closed with a similar construct with a forward slash following the lesser than sign (</SCRIPT>).
This tells the browser that all that is written between the opening tag (<SCRIPT>) and the closing one (</SCRIPT>) must be treated as a script and not as plain HTML.
Of course we must tell the browser what kind of language we are writing our script.
For that reason we added the attribute "LANGUAGE="JavaScript"" to our opening tag.
Ok, of course we all know that most browser will assume LANGUAGE="JavaScript" if we omit it, but we are keeping it for two good reasons.
1. For readability, so we don't have any dough about it.
2. Just in case there is any browser that don't know this rule :-).
Please notice that we don't need (nor should) specify any attributes in the closing tag. Only the tag name should be used (</SCRIPT>).

In between, we have our code: document.write("Hello World !!!");.
In this sentence we can identify two part separated by a dot.
In the left side of the dot we have the word document, the object of our action, and it refers to the body (remember the <body></body> pair) of our HTML document.
In the right side we identify the action we want to perform in our object.
In this case we want to write the sentence Hello World !!!.
Please notice the following details:
We have surrounded our sentence between a pair of double quotation marks.
This must be used every time we want to use a string of text and tells the browser we want our string to be used exactly as it is. Otherwise the browser would assume it was a variable.
Right after the write statement we have a pair of matching parenthesis.
This tells the browser that write is a method (a function) of the object document and not a property (a variable) of that object.
I ended the whole sentence with a semicolon.
This is not mandatory in JavaScript and you can omit it if you want (at least most of the times).
I always keep it because I'm an old time C language programmer an those habits tend to last (this is mandatory both in C language and in Java).

I think this is enough for you to get the general idea
Please feel free to mess with the example.
Try to add other document.write... statements.
And have fun...
Last update:
2000/02/01
This page hosted by
Get your own Free Homepage
 Prepared by:
Ricardo Lindengrün

Click Here!