You are on page 1of 16

CAP214: FUNDAMENTALS OF WEBPROGRAMMING

HOMEWORK: 4

Submitted by:

Name: Aparnesh Roy

Course: BCA-MCA (Dual Degree)

Section: D3901

Roll No.: RD3901A32

Registration No.: 10904928

Group: 1

Submitted to:

Lect. Rajeev Kanday


PART: “A”
1. Write a program in JavaScript that stores 10
items of the same data type in an Array and print
them on the screen in reverse order?

Ans.:

Program in JavaScript that stores 10 items of the


same data type in an Array and print them on the
screen in reverse order is given below as follows:
<html>

<head>

<title>Array: Insertion & Reverse</title>

<script language="Javascript">

var arr=new Array();

var i;

document.write("Please enter 10 elements in the array (same


datatype): <br>")

for(i=0;i<10;i++)

arr[i]=prompt(" ");

document.write("<br>");
document.write("Entered elements are as follows: ");

document.write("<br>");

for(i=0;i<10;i++)

document.write("&nbsp;",arr[i]);

arr.reverse();

document.write("<br>");

document.write("After reversing elements of above array: ");

document.write("<br>");

for(i=0;i<10;i++)

document.write("&nbsp;",arr[i]);

</script>

<body bgcolor="Grey" text="White">

<p><br><b>Above is a program of reversing an array</b></p>

</body>

</html>
2. Write a program in JavaScript that accepts a
number as an input from the user and prints the
message “Number is greater than 100” if the number
is greater than 100 or prints “Number is smaller than
100” if the number is smaller than 100.

Ans.:

Program in JavaScript that accepts a number as


an input from the user and prints the message
“Number is greater than 100” if the number is greater
than 100 or prints “Number is smaller than 100” if the
number is smaller than 100 is given below as follows:
<html>

<head>

<title>Greater/Smaller than 100</title>

<script language="Javascript">

var x;

x=prompt("Please enter your number: "," ");

document.write("<br>");

if(x>100)

document.write("Number is greater than 100");

else

{
document.write("Number is smaller than 100");

</script>

<body bgcolor="Grey" text="White">

<p><br><b>Above is a program of finding greater/smaller than


100</b></p>

</body>

<html>

3. Write a program in JavaScript that adds the


elements of two 3x3 matrices and stores the values in
a third matrix and prints it on the screen?

Ans.:

Program in JavaScript that adds the elements of


two 3x3 matrices and stores the values in a third
matrix and prints it on the screen is given below as
follows:
<html>

<head>

<title>3x3 Matrix Addition & Display</title>

<script language="Javascript">

var arr1=new Array();


var arr2=new Array();

var add=new Array();

var i,j;

document.write("Please enter elements in the first 3x3 2-D array:


<br>")

for(i=0;i<3;i++)

arr1[i]=new Array();

for(j=0;j<3;j++)

arr1[i][j]=parseInt(prompt(" "));

document.write("Please enter elements in the second 3x3 2-D array:


<br>")

for(i=0;i<3;i++)

arr2[i]=new Array();

for(j=0;j<3;j++)

arr2[i][j]=parseInt(prompt(" "));

}
document.write("<br>");

document.write("Entered elements of first matrix are as follows: ");

document.write("<br>");

for(i=0;i<3;i++)

for(j=0;j<3;j++)

document.write("&nbsp;&nbsp;&nbsp;",arr1[i][j]);

document.write("<br>");

document.write("<br>");

document.write("Entered elements of second matrix are as follows:


");

document.write("<br>");

for(i=0;i<3;i++)

for(j=0;j<3;j++)

document.write("&nbsp;&nbsp;&nbsp;",arr2[i][j]);

document.write("<br>");

}
document.write("<br>");

for(i=0;i<3;i++)

add[i]=new Array();

for(j=0;j<3;j++)

add[i][j]=arr1[i][j]+arr2[i][j];

document.write("<br>");

document.write("After addition of both above matrices: ");

document.write("<br>");

for(i=0;i<3;i++)

for(j=0;j<3;j++)

document.write("&nbsp;&nbsp;&nbsp;",add[i][j]);

document.write("<br>");

</script>
<body bgcolor="Grey" text="White">

<p>

<br><b>Above is a program of matrix addition</b>

</p>

</body>

<html>

PART: “B”
4. With the help of an example, explain the use of
onMouseOver and onMouseOut event handlers in
JavaScript?

Ans.:

onMouseOver Event: Script to be run when mouse pointer


moves over an element.

onMouseOut Event: Script to be run when mouse pointer


moves out of an element.

Example of OnMouseOver and OnMouseOut in


JavaScript:

<html>

<body>

<img border="0" id="imgGGL" src="ggl.gif" width="198"


height="202" onmouseover="alert(' Hello you are so sweet at
JavaScript Tutorial..... ')" onmouseout="backImage()">
<script lang="text/javascript">

<!--

function backImage()

document.imgGGL.src="ggl.gif";

-->

</script>

</body>

</html>

5. How can you implement timer control in


JavaScript? Explain with the help of a JavaScript
code?

Ans.:
With JavaScript, it is possible to execute some code after a specified time-
interval. This is called timing events.

It's very easy to time events in JavaScript. The two key methods that are
used are:

 setTimeout() - executes a code sometime in the future


 clearTimeout() - cancels the setTimeout()

The setTimeout() Method:


Syntax
var t=setTimeout("javascript statement",milliseconds);

The setTimeout() method returns a value - In the statement above, the value
is stored in a variable called t. If you want to cancel this setTimeout(), you
can refer to it using the variable name.

The first parameter of setTimeout() is a string that contains a JavaScript


statement. This statement could be a statement like "alert('5 seconds!')" or
a call to a function, like "alertMsg()".

The second parameter indicates how many milliseconds from now you want
to execute the first parameter.

Example: When the button is clicked in the example


below, an alert box will be displayed after 3 seconds.
<html>

<head>

<script type="text/javascript">

function timedMsg()

var t=setTimeout("alert('I am displayed after 3


seconds!')",3000);

</script>

</head>
<body>

<form>

<input type="button" value="Display alert box!"


onClick="timedMsg()" />

</form>

</body>

</html>

The clearTimeout() Method

Syntax:
clearTimeout(setTimeout_variable)

Example: The example below is the same as the


"Infinite Loop" example above. The only difference is
that we have now added a "Stop Count!" button that
stops the timer:
<html>

<head>

<script type="text/javascript">

var c=0;

var t;

var timer_is_on=0;
function timedCount()

document.getElementById('txt').value=c;

c=c+1;

t=setTimeout("timedCount()",1000);

function doTimer()

if (!timer_is_on)

timer_is_on=1;

timedCount();

function stopCount()

clearTimeout(t);

timer_is_on=0;

</script>
</head>

<body>

<form>

<input type="button" value="Start count!" onClick="doTimer()">

<input type="text" id="txt">

<input type="button" value="Stop count!" onClick="stopCount()">

</form>

</body>

</html>

6. Write a program in JavaScript that displays


the different types of dialog boxes?

Ans.:
JavaScript has three kinds of popup boxes (Dialog Boxes): Alert
box, Confirm box, and Prompt box.

Program in JavaScript that displays the different


types of dialog boxes is given below as follows:
<html>

<head>

<script type="text/javascript">

function show_alert()

alert("I am an alert box!");


}

function show_confirm()

var r=confirm("Press a button");

if (r==true)

alert("You pressed OK!");

else

alert("You pressed Cancel!");

function show_prompt()

var name=prompt("Please enter your name"," ");

if (name!=null && name!="")

document.write("Hello " + name + "! How are you


today?");

}
}

</script>

</head>

<body>

<input type="button" onclick="show_alert()" value="Show alert


box" />

<input type="button" onclick="show_confirm()" value="Show


confirm box" />

<input type="button" onclick="show_prompt()" value="Show prompt


box" />

</body>

</html>

You might also like