Jump to content
Sign in to follow this  

Javascript Tut - First Script

Recommended Posts

Fire up whatever text editor you're comfortable with. For us, we're going to be using Notepad on a Windows machine. Add the simple HTML you see below:


So we have the HEAD and BODY tags of a HTML page, along with a TITLE area at the top. Save your text file with the name first_script.html. If you're using Notepad then you need to change theSave As Type area at the bottom to All Files, otherwise you'll end up with a text file rather than a HTML page that you can load into a browser. (You don't need to do this if you're using TextEdit on a Mac. Just type first_script.html in the Save As box.)


We now need to add some Javascript tags. In between the two BODY tags, then, add the following:


The lines you're adding are these:

<SCRIPT LANGUAGE = "Javascript">

alert("Hello World")


Programming scripts are added between two <SCRIPT> tags, an opening one and a closing one. An attribute to the SCRIPT tag is LANGUAGE. This tells the browser which scripting language is being used. For us, this is Javascript. This goes after an equal sign ( = ). Notice that we've surrounded the word Javascript with double quote marks. But you don't have to. In fact, you can miss out the LANGUAGE attribute altogether and just have this:


alert("Hello World")


Any Javascript you want to add needs to go between the two SCRIPT tags. Careful of the forward slash for the end SCRIPT tag - miss this out and your code won't work. Like all HTML tags, though, the two SCRIPT tags can be lowercase, if you prefer:


alert("Hello World")


However, although the SCRIPT tags are not case sensitive Javascript very definitely is. Our code consists of a single line, a simple alert box. All it does is to display a dialogue box with the words "Hello World". Try it out. Save your work. Now use Windows Explorer or Finder on a Mac to navigate to where you saved the HTML file. Double click to run your script in a browser. You should see the following in Firefox:


Or this in Internet Explorer:


Now change your alert line to this:

Alert("Hello World")

The word alert now has a capital "A". Save your work and reload the page in your browser. You should find that the alert box no longer displays. Change it back to a lowercase "a", save and reload. The alert box will come back.

Alert Boxes are used to display information to your users. In between a pair of round brackets, you type the text you want people to see. This text goes between quote marks (single or double quotes, but not a mixture of the two).


Confirm and Prompt

As well as an alert box, you can have a confirm and a prompt box. Using a confirm box will get you two buttons, OK and Cancel. They are normally used with an IF Statements to detect which of the two buttons was clicked. You'll learn about IF Statements in a later section, but the code for a Confirm box is just this:

confirm("OK or Cancel?")

Again, the text you want to display goes between quote marks. In a browser, the confirm box looks like this:


A prompt box is used when you want some input from the user. The code for a Prompt box is this:

prompt("Favourite Colour?", "Red")

The prompt box has two parts between the round brackets. The first part is the heading, while the second part is some default text. Here's what they look like in a browser:


A user can enter some text in the text box. When the OK button is clicked you can get at the text the user entered and do something with it. You'll see how to do this in the IF Statements section.

For both confirm and prompt boxes lowercase letters are used.


This was not created by me. Credits to the authors!

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

About us

MMO-Society is the Forum former known as Lordcraft, MMO-Society offers various of Resources to help you evolve your knowledge within Emulation, In the process we make sure to form a strong community bond in-between each other and thus we are proud to can admit that MMO-Society is possibly the friendliest Community Forum to currently exist.

Useful Quick-Links

  • Create New...