Chapter 1: Introduction to JavaScript

  Chapter 2Chapter 3Chapter 4Chapter 5Chapter 6Chapter 7
 

 

Introduction

Well, let assume you have already mastered HTML, would you be happy  to just  stay at this level, or would you like to make your webpage more alive and interactive? If you want to enhance your webpage and make it more powerful, you have come to the right place! The answer is JavaScript! Although JavaScript has been around for more than a decade, many people are still not familiar with the language. So, I would like to share with you what is a JavaScript.

Why JavaScript? You may have this question in mind. Well, let me get to the point. HTML or HyperText Markup Language was the only language that was used to present text and graphics as well as links to the world wide web users in the 90's of the last century . Although it was a vast improvement from the earlier text-only browsers like Gopher, it was relatively passive and static, it can't interact much with the users.  So, we need JavaScript! JavaScript can turn a webpage into a lively interactive platform for world wide web users! JavaScript is a scripting language for HTML. By using JavaScript , you can add sound, date, time, change the color of the webpage according to certain day, pre-validate data entered into a form by the users before it is sent to the server, search through a database, set options based on users preferences and much more.

You might want to ask what is this thing called scripting language? Actually a script is made up of a sequence of statements or instructions for the computer to perform certain jobs, for example, like providing a response to the users, to play a song, to start a slide show, to display certain advertisements and so on. It is simple programming language with much lower learning barrier than the actual computer languages like JAVA, C++, Turbo Pasacal and etc. For example, the following JavaScript displays current date on a webpage, the instrutions only made up of a few lines.

<Script type="text/javascript">
<!--
var currentTime = new Date()
var month = currentTime.getMonth() + 1
var day = currentTime.getDate()
var year = currentTime.getFullYear()
document.write(month + "/" + day + "/" + year)
//-->
</script>

 

The Output

Date:

 

 

 

 

Another example is the options button. You can select certain item then click OK, it will bring you to the selected page.The codes are shown below:

 

Search for your books by selecting a category, then click OK .

 

<SCRIPT LANGUAGE="JavaScript">
//created by Liew Voon Kiong April 24 1998 All Rights Reserved.

function loadHtml(form){
if (form.list.selectedIndex==0) location="art.html"
if (form.list.selectedIndex==1) location="astro.html"
if (form.list.selectedIndex==2) location="bestsell.html"
if (form.list.selectedIndex==3) location="business.html"
if (form.list.selectedIndex==4) location="children.html"
if (form.list.selectedIndex==5) location="computer.html"
if (form.list.selectedIndex==6) location="health.html"
if (form.list.selectedIndex==7) location="mystery.html"
if (form.list.selectedIndex==8) location="horror.html"
if (form.list.selectedIndex==9) location="nonfic.html"
if (form.list.selectedIndex==10) location="romance.html"
if (form.list.selectedIndex==11) location="science.html"
if (form.list.selectedIndex==12) location="scific.html"
if (form.list.selectedIndex==13) location="self.html"
if (form.list.selectedIndex==14) location="sports.html"
if (form.list.selectedIndex==15) location="travel.html"
if (form.list.selectedIndex==16) location="young.html"
if (form.list.selectedIndex==17) location="music.html"

}
</Script>

Let these two examples be the introduction to a series of articles on JavaScript, come back regularly for the updates. By the way, feel free to use my examples, but please address the programmer.

[Back to HTMLTutorial][Back to Vbtutor]<Chapter 2>