Java Script:: Body of The Code

Java Script :
HTML pages which we have discussed so far are considered as static HTML pages,these pages
layout remains same. But , if you want to create the dynamic page , with the programming
support then you have to make use of the scripting languages.
Scripting languages are not the complete programming laguages then work within the HTML
code.
The Scripting Language in the market are VBScript,Javascript etc..
The Scripting code is written in the <script> tag , and the general form is ,
<script langauge="JavaScript/VBScript">
Body of the code
</script>
Displaying the Information Using JavaScript Code
(a) document.write( )
The document object is used to identify the webpage and it provides the method or
the function known as write( ) to display the infomation on the browser windows.
Note : JavaScript is case sensitive.
Consider the following code ,
<html>
<head>
<title>Using the JavaScript </title>
</head>
<body bgcolor="#ccffee">
<script language="JavaScript">
document.write("Welcome to JavaScript");
</script>
</body>
</html>
output :
(b) alert( )
This function will display a dialog box on the screen ,via, which we can display
the information on the screen.
The general form is ,
alert("message");
<html>
<head>
<title>Using the JavaScript </title>
</head>
alert("Welcome to JavaScript");
</script>
</body>
</html>
output :
Tuesday, July 11, 2006

Declaring the variables:
To declare the variable we will use the var keyword.

var variablelist;
Note that the var type variable is capable of holding any type of value.
Reading the Information from the User :
prompt( ) :
This function is used to read the information from the
user.
prompt("message");
<html>
<head>
<title>Using JavaScript</title>
</head>
var sname;
sname=prompt("Enter your name :");
document.write("<center><h1>Your Name is : "+sname+" </h1></center>");

</script>
</body>
</html>
output :
Note : Whatever you enter or input using the prompt( )
will be considered as a string.
parseInt( ) :
This function is used to convert the string into integer.
Q Write a JavaScript code to add two numbers.
<html>
<head>
</head>
var a,b,c;
a=prompt("Enter the value of a :");
b=prompt("Enter the value of b:");
c=a+b;
document.write("Sum= " + c);

</script>
</body>
</html>
output :
Now, consider the following program,
<html>
<head>
</head>
var a,b,c;
a=parseInt(a);
b=parseInt(b);
c=a+b;
document.write("Sum= " + c);

</script>
</body>
</html>
Using conditional statements :
if(condition)
statement1;
else
statement2;
where,statement1 will get executed when the condition is true and the statment2 will
get executed when the condition is false.
Q. Write a javascript code to check whether the number is even or odd.
<html>
<head>
</head>
var num;
num=prompt("Enter the number :");
num=parseInt(num);
if(num%2==0)
document.write("number is even");
else
document.write("number is odd");
</script>
</body>
</html>
output :
Q Write a javascript code to find the largest of three numbers.
<html>
<head>
</head>
var a,b,c;
c=prompt("Enter the value of c:");
a=parseInt(a);
b=parseInt(b);
c=parseInt(c);
if(a>b)
if(a>c)
document.write("a is largest");
else
document.write("c is largest");
else
if(b>c)
document.write("b is largest");
else
document.write("c is largest");
</script>
</body>
</html>
Wednesday, July 12, 2006
Loops :
The term Loops refers to executing a statement or a group of statement till the specified
condition is true.
(i) for loop :
for(initliase the variable;condition;increament/decreament)

{
body of loop
}
Consider the following :

n=4
1
12
123
1234
<html>
<head>
</head>
var i,j,n;
n=prompt("Enter the value of n:");
document.write("<br><br><br>") ;
for(i=1;i<=n;i++)
{
for(j=1;j<=i;j++)
{
document.write(j);
}
document.write("<br>");
}
</script>
</body>
</html>
output :
(ii) while loop
/*initialise the variable*/
while(condition)/*test the condition*/

{
/*body of the loop*/
/*increament or decreament the variable*/

}
<html>
<head>
</head>
var num,rev;
rev=0;
while(num!=0)
{
rev=rev*10+num%10;
num=parseInt(num/10);
}
document.write("Reverse :"+rev);
</script>
</body>
</html>
output :
(iii) do...while loop
/*initialise the variable*/
do
{
/*body of the loop*/
/*increament or decreament the variable*/
}while(condition);
<html>
<head>
</head>
var num,sum,org;
num=parseInt(num);
org=num;
sum=0;
do
{
sum=sum+(num%10)*(num%10)*(num%10);
num=parseInt(num/10);
}while(num!=0);
if(sum==org)
document.write("Armstrong Number .");
else
document.write("Not an armstrong number.");
</script>
</body>
</html>
output :
Defining functions in JavaScript :
The general form is,
function functionname(argument list)

{
body of the function
}
Consider the following program ,
(i) When the function will return a value
<html>
<head>
function factorial(num)
{
var fact,i;
fact=1;
for(i=1;i<=num;i++)
fact=fact*i;
return fact;
}
</script>
</head>
var num,fact;
num=prompt("Enter the number:");
fact=factorial(num);
document.write("Factorial of " + num + " is = " + fact);

</script>
</body>
</html>
output :
(ii) When the function will not return a value
<html>
<head>
function factorial(num)
{
var fact,i;
fact=1;
for(i=1;i<=num;i++)
fact=fact*i;
document.write("Factorial of " + num + " is = " + fact);
}
</script>
</head>
var num;
num=prompt("Enter the number:");
factorial(num);
</script>
</body>
</html>
output :
Thursday, July 13, 2006

Event Handling :
Events as we know are the actions performed by the computer system or the user.
In case of the event handling , we have ,
(a) Type of event which is to be raised.
(b) Code which is to be executed when the event is raised.

(a) Type of Events
There are various events which we can handle.
(i) onLoad( ) :
This will occur when we load the body or other tag.
(ii) onClick( ) :
This will occur when we click on the item.
(iii) onDblClick( ):
This will occur when we double click the item.
(iv) onFocus( ) :
This will occur when the control recieve the focus.
(v) onBlur( ) :
This will occur when the control will lost the focus.
(vi) onMouseOver( )
This will occur when we place the mouse over an

object.
(vii) onMouseOut( )
This will occur when we move the mouse out of an object.
etc....
(b) Code which is to be executed when the event is raised.
Here , we have to write a function which is to be executed when a particular event is

raised.
Question : Design the JavaScript code to display the dialog box when the
page is loaded in the memory.
<html>
<head>
<title>Using Event Handling</title>
function wel( )
{
alert("Welcome to JavaScript Event Handling");
}
</script>
</head>
<body onLoad="wel( )" bgcolor="red">
</body>
</html>
output :
Q Design the JavaScript code to create the button and when the user click on it a message is
displayed.
<html>
<head>
function msg( )
{
alert("You Clicked on Me.........");
}
</script>
</head>
<body bgcolor="red">
<br>
<br>
<br>
<center>
<form name="myform">
<input type=button name="cmdbutton" value="Click Me" onClick="msg( )">
</form>
</center>
</body>
</html>
output :
Q Design the JavaScript code , for creating the application which containts , three buttons,
Red , Green and Blue to change the background color
accordingly.
<html>
<head>
<title>Using the Event Handling in JavaScript.</title>
function changeRed( )
{
document.bgColor="red";
}
function changeGreen( )
{
document.bgColor="green";
}
function changeBlue( )
{
document.bgColor="blue";
}
</script>
</head>
<body bgcolor="#ccddee">
<center>
<br>
<br>
<input type="button" name="cmdred" onClick="changeRed( )" value="Red">
<input type="button" name="cmdgree" onClick="changeGreen( )" value="Green">
<input type="button" name="cmdblue" onClick="changeBlue( )" value="Blue">
</form>
</center>
</body>
</html>
output :
Q Design the application to acces the value of the text box
<html>
<head>
function show( )
{
var sname;
sname=document.myform.txtname.value;
document.write("Your Name is : " + sname);

}
</script>
</head>
<center>
<br>
<br>
Enter your name : <input type="text" name="txtname">
<br>
<input type="button" name="cmdshow" value="Show" onClick="show()">
</form>
</center>
</body>
</html>
Q Design the application to apply the following validation on the user name .
* The user name should be atleat 6 characters long

* Must start with an alphabet
* contains alphabet ,digits or underscore.

**************************************************
Q Design the application which contains three textboxes for two number and a result , and
perform +,-,*,/ and %.
<html>
<head>
<title>Using Event Handling in JavaScript</title>
function add( )
{
var a,b,c;
a=document.myform.txta.value;
b=document.myform.txtb.value;
a=parseInt(a);
b=parseInt(b);
c=a+b;
document.myform.txtc.value=c;
}
function subtract( )
{
var a,b,c;
a=parseInt(a);
b=parseInt(b);
c=a-b;
}
function multiply( )
{
var a,b,c;
a=parseInt(a);
b=parseInt(b);
c=a*b;
}
function divide( )
{
var a,b,c;
a=parseInt(a);
b=parseInt(b);
c=a/b;
}
function mod( )
{
var a,b,c;
a=parseInt(a);
b=parseInt(b);
c=a%b;
}
</script>
</head>
<center>
<br>
<br>
<b> Enter the value of a : </b><input type="text" name="txta"><br>
<b> Enter the value of b : </b><input type="text" name="txtb"><br>
<br>
<input type="button" name="cmdplus" value="+" onClick="add( )"><input type="button"
name="cmdminus" value="-" onClick="subtract( )"><input type="button" name="cmdmult"
value="*" onClick="multiply( )"><input type="button" name="cmddiv" value="/"
onClick="divide( )"><input type="button" name="cmdmod" value="%" onClick="mod( )"><br>
<br>
<b> Result : </b><input type="text" name="txtc">
<br>
</form>
</center>
</body>
</html>
Saturday, July 15, 2006

Arrays : An array is the collection of elements.In JavaScript we can declare the array by,
arrayname=new Array(size of array);
e.g.
x=new Array(5);
Consider the following code,
<html>
<head>
</head>
x=new Array(5);
x[0]=10;
x[1]=12;
x[2]=13;
x[3]=14;
x[4]=16;
var i;
for(i=0;i<5;i++)
{
document.write(x[i]+"<br>");
}
</script>
</body>
</html>

Java Script:: Body of The Code

Uploaded by

Copyright:

Available Formats

Java Script:: Body of The Code

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Java Script:: Body of The Code

Uploaded by

Copyright:

Available Formats

Java Script :

The Scripting Language in the market are VBScript,Javascript etc..

Displaying the Information Using JavaScript Code

Note : JavaScript is case sensitive.

Consider the following code ,

The general form is ,

Consider the following code ,

Tuesday, July 11, 2006

To declare the variable we will use the var keyword.

The general form is ,

Reading the Information from the User :

The general form is ,

Consider the following code ,

sname=prompt("Enter your name :");

document.write("<center><h1>Your Name is : "+sname+" </h1></center>");

Q Write a JavaScript code to add two numbers.

a=prompt("Enter the value of a :");

b=prompt("Enter the value of b:");

document.write("Sum= " + c);

a=prompt("Enter the value of a :");

b=prompt("Enter the value of b:");

document.write("Sum= " + c);

Using conditional statements :

The general form is ,

Q. Write a javascript code to check whether the number is even or odd.

num=prompt("Enter the number :");

a=prompt("Enter the value of a :");

b=prompt("Enter the value of b:");

c=prompt("Enter the value of c:");

(i) for loop :

The general form is ,

for(initliase the variable;condition;increament/decreament)

Consider the following :

n=prompt("Enter the value of n:");

(ii) while loop

/*initialise the variable*/

while(condition)/*test the condition*/

/*increament or decreament the variable*/

num=prompt("Enter the number :");

The general form is ,

/*initialise the variable*/

/*increament or decreament the variable*/

num=prompt("Enter the number :");

Defining functions in JavaScript :

The general form is,

function functionname(argument list)

Consider the following program ,

(i) When the function will return a value

num=prompt("Enter the number:");

document.write("Factorial of " + num + " is = " + fact);

document.write("Factorial of " + num + " is = " + fact);

Thursday, July 13, 2006

In case of the event handling , we have ,

(a) Type of event which is to be raised.

(b) Code which is to be executed when the event is raised.

There are various events which we can handle.

This will occur when we load the body or other tag.

This will occur when we click on the item.

This will occur when we double click the item.

/initialise the variable/

while(condition)/test the condition/

/increament or decreament the variable/

/initialise the variable/

/increament or decreament the variable/