in4mation ... organized

Master Javascript by Typing Part 1

A series by Pramod S Nair for Wisdombay (originally published in www.spidercreationsindia.com)

The Basics
This section will give information on how to incorporate JavaScript into HTML pages.

The Software You Need

All you'll need is a text editor (Notepad will do fine) and a browser.

What are HTML Pages?
HTML is a text-layout language, with help of which the most diverse systems can produce
nearly identical results. This is due to the fact that the files in which the HTML code is saved,
that is, files with the endings *.HTM or *.HTML, contain only ASCII text. The code in these
files specifies, for example, which background color, which text color, which text and pictures
in which order the page should contain & they get rendered in the client machine by the browser.

OK LET'S start.

CLASS I - Integrating javascript to a HTML Page.

For integrating javascript into the HTML code, you have three options

  1. Incorporating code in the Header section of Html

    The first method is to incorporate the script into the header of the HTML file. You can do this in the following way,

    <title>My first script</title>
    <script language="JavaScript">
    //This line is a comment
    alert("Welcome to www.spidercreationsindia.com")

    <h1> This page displays a small box that greets you on visiting the page

    Launch your Text Editor, type the above given code & save as first.html (or any other name you prefer). Now view the file that you created in browser & you will see a dialog box that displays the message that you gave as parameter to the alert() function.

    Analysing the code

    You will write javascript with in
    <script language="JavaScript"> tag & </script> tag.

    In the above code there is only a single line of source code that is the alert("Welcome to www.spidercreationsindia.com") line. In javascript you will use alert() function to display messages to the viewer.

    Its syntax is :

    alert("message to display")

  2. Adding code inside a HTML tag itself to control certain Events

    The second option is to include JavaScript commands to control ceratin events like, loading or unloading a page or clicking a button with mouse etc.

    <title>My second script</title>
    <h1> This page displays a small box that greets you on clicking the button given below</h1>
    <form> <input type="button" value="Click Me" onClick='alert("Yes Sir")'>