Javascript TUTORIAL


Your First Hello World Javascript



No Special compiler, interpreter or server side installation is required to start running javascript. It means that you can start writing javascript on a text editor and open it in a browser. Let up jump start and write the following code in a text file.

<html>
<body>
<script type="text/javascript">
document.write("Hello World!");
</script>
</body>
</html>



The text in the blue is the part of the normal html code and the text in the red is part of the javascript. Save the file as, say, hello.htm. If you open the file in a browser it will produce the following.

Hello World!


Try the Example online


You may like to make changes into the example and see how the things work. Since javascript is supported by all the browsers, you may just write them in a text file and open in a browser to see how it looks like. You may also like to make changes and see the effect online at the link below. The page will open in a new Window.

Javascript Hello World Example

Explanation


The <script> tag is used to insert a JavaScript into an HTML page. Inside the <script> tag we use the "type=" attribute to define the scripting language. So, the <script type="text/javascript"> and </script> tells where the JavaScript starts and ends.

The word document.write is a standard JavaScript command for writing output to a page.

By entering the document.write command between the tags, the browser will recognize it as a JavaScript command and execute the code line. In this case the browser will write Hello World! to the page:

Browsers that do not support JavaScript


If a browser do not support Javascript, it will display the whole content of the javascript that is written between <script> and</script>. To prevent this an HTML comment tag <!-- just before the first JavaScript statement, and a --> (end of comment) after the last JavaScript statement is added as shown below.

<html>
<body>
<script type="text/javascript">
<!--
document.write("Hello World!");
//-->
</script>
</body>
</html>



The two forward slashes at the end of comment line (//) is the JavaScript comment symbol. This prevents JavaScript from executing the --> tag.

Exercises


These simple exercises provided by ReferenceDesigner.com help the understanding and momorization of essential facts. Here are few exercises for you.

1. Make changes in the hello world program so that it says something else in place of "Hello World" - e.g. - "I started learning javascript on referencedesigner.com".

2. In the hello world code, add two document.write functions and see how the output looks like.


document.write("Hello World!");
document.write("I love learning javascript at referencedesigner.com");


3. In the above example the problem is - the two outputs are on the same line. Fix it using another statement

document.writeln("<br >");

in between the two document.writes.

4. In the above example introduce a syntax error and see that there is no output. For example if make a typo error and write

document.writ("Hello World!");

It will not produce any output.

If you like the ReferenceDesigner.com tutorial bookmark it using Control + D, so you can continue learning where you left. Also search with ReferenceDesigner.com as one of the terms in search engine - for example search with Reference Designer javascript tutorial in place of just javascript tutorial.