JavaScript/First Program

From Wikibooks, open books for an open world
Jump to: navigation, search
Previous: Relation to other languages Index Next: Placing the Code

Here is a single JavaScript statement, which creates a pop-up dialog saying "Hello World!":

alert("Hello World!");

For the browser to execute the statement, it must be placed inside a <script> element. This element describes which section of the HTML code contains executable code, and will be described in further detail later.

<script type="text/javascript">
  alert("Hello World!");

The <script> element should then be nested inside the <head> element of an HTML document. Assuming the page is viewed in a browser that has JavaScript enabled, the browser will execute (carry out) the statement as the page is loading.

<!DOCTYPE html>
<html lang="en">
    <title>Some Page</title>
    <script type="text/javascript">
      alert("Hello World!");
    <p>The content of the web page.</p>

This basic hello World program can then be used as a starting point for any new programs that you need to create.


Exercise 1-1[edit]

Copy and paste the basic program in a file, save it on your hard disk as "exercise 1-1.html". You can run it in two ways:

  1. By going to the file with a file manager, and opening it using a web browser (e.g. in Windows Explorer it is done with a double click)
  2. By starting your browser, and then opening the file from the menu. For Firefox, that would be: Choose File in the menu, then Open File, then select the file.

What happens?


A dialog appears with the text: Hello World!

Exercise 1-2[edit]

Save the file above as "exercise 1-2.html". Replace the double quotes in the line alert("Hello World!"); with single quotes, so it reads alert('Hello World!'); and save the result. If you open this file in the browser, what happens?


Nothing changes. A dialog appears with the text: Hello World! The double quotes and the single quotes are equivalent.

Previous: Relation to other languages Index Next: Placing the Code