1. Write JavaScript program that ask the user for two numbers , adds them up and return
the result to the user
2. Improve the question 1 so that it also does subtraction , multiplication and division on the
two numbers , calculate the average calculation on 5 numbers and make new line for
every operation
3. Write a program that will ask the user for his or her first name , last name , and middle
initial . Return then back in the order of last name , first name and middle initial , then in
the first name , middle initial and last name format
1. Write JavaScript program that ask the user for two numbers , adds them up and return
the result to the user
<html>
<head>
<title>~: ADDING TWO NUMBERS :~</title>
<style type="text/css"> /*USING EMBEDDED STYLE*/
/*PAGE BACKGROUND*/
body
{
background-image:url(../../../cam_love.jpg);
background-color:#FFCC66;
background-attachment:fixed;
background-position:center;
background-repeat:no-repeat;
}
/*TITLE <H1>*/
h1
{
font-family:"20.000 dollar bail";
font-size:17px;
margin-top:32px;
margin-left:350;
text-decoration:underline;
}
/*TITLE <H2>*/
h2
{
font-family:"20.000 dollar bail";
font-size:17px;
margin-left:310;
text-decoration:underline;
}
/*TITLE <H3>*/
h3
{
font-family:"20.000 dollar bail";
font-size:18px;
margin-left:300;
text-decoration:underline;
}
<!--HIDE
var firstnumber;
var secondnumber;
var total;
-->
</script>
</head>
</script>
</body>
</html>
VIEW IN MOZILLA FIREFOX
1)
2)
3)
2. Improve the question 1 so that it also does subtraction , multiplication and division on the
two numbers , calculate the average calculation on 5 numbers and make new line for
every operation
<html>
<head>
<title>~: MATHEMATICS OPERATION :~</title>
<style type="text/css"> /*USING EMBEDDED STYLE*/
/*PAGE BACKGROUND*/
body
{
background-image:url(../../../math.jpg);
background-color:#FF66FF;
background-attachment:fixed;
background-position:center;
background-repeat:no-repeat;
}
/*TITLE <H1>*/
h1
{
font-family:Caduceus;
font-size:17px;
margin-top:32px;
text-align:center;
color:#FFFFFF;
text-decoration:overline;
}
/*TITLE <H2>*/
h2
{
font-family:Caduceus;
font-size:17px;
text-align:center;
color:#FFFFFF;
text-decoration:overline;
}
/*TITLE <H3>*/
h3
{
font-family:Caduceus;
font-size:18px;
text-align:center;
color:#FFFFFF;
text-decoration:overline;
}
</style>
<SCRIPT language="JavaScript">
<!--HIDE
var firstnumber;
var secondnumber;
var thirdnumber;
var fourthnumber;
var fifthnumber;
var total;
var fulltotal;
//-->
</SCRIPT>
</HEAD>
function addtext1()
{
var newtext1 = document.kira.add.value;
document.kira.add.value += newtext1;
}
</SCRIPT>
<form name="kira">
<p> <center>
<textarea name="add" wrap="ON" onSelect="addtext1()" style=" " cols="20"
rows="5"></textarea>
</p>
<p>
<input type="text" name="firstnumber" onClick="addition();">
+
<input type="text" name="secondnumber" onClick="addition();">
<p>
<input type="text" name="firstnumber2" onClick="substraction();">
-
<input type="text" name="secondnumber2" onClick="substraction();">
<p>
<input type="text" name="firstnumber3" onClick="multiplication();">
*
<input type="text" name="secondnumber3" onClick="multiplication();">
<p>
<input type="text" name="firstnumber4" onClick="division();">
/
<input type="text" name="secondnumber4" onClick="division();">
<p>
<input type="text" name="firstnumber5" onClick="average();">
+
<input type="text" name="secondnumber5" onClick="average();">
+
<input type="text" name="thirdnumber" onClick="average();">
+
<input type="text" name="fourthnumber" onClick="average();">
+
<input type="text" name="fifthnumber" onClick="average();">
1)
2)
VIEW IN MOZILLA FIREFOX
1)
2)
3)
4)
5)
3. Write a program that will ask the user for his or her first name , last name , and middle
initial . Return then back in the order of last name , first name and middle initial , then in
the first name , middle initial and last name format
<html>
<head>
<title>~: NAME :~</title>
<style type="text/css">
/*USING EMBEDDED STYLE*/
/*PAGE BACKGROUND*/
body
{
background-image:url(../../../Downloads/yellow.jpg);
background-color:#663333;
background-attachment:fixed;
background-position:center;
background-repeat:no-repeat;
}
/*OUTPUT*/
h1
{
font-family:Caduceus;
margin-top:100px;
color:#FFFFFF;
}
/*TABLE STYLE*/
.style1 {font-family: Caduceus; color:#FFFFFF;}
.style2 {color: #FFFFFF}
.style3 {font-family: Caduceus; color: #FFFFFF; }
</style>
<body >
<!--hide
window.alert("~~PLEASE ENTER YOUR NAME~~");
var firstname= prompt('~Please enter your first name~,', ' ');
<!-- ASK USER TO ENTER FIRST NAME-->
var lastname= prompt('~Please enter your last name~,', ' ');
<!-- ASK USER TO ENTER LAST NAME-->
var middlename= prompt('~Please enter your middle name~,', ' ');
<!-- ASK USER TO ENTER MIDDLE NAME-->
//-->
</SCRIPT>
</head>
<body>
<div align="center">
<SCRIPT language="javascript">
<!--hide
document.write("<center><H1>Hello, <br> "+firstname+" "+middlename+" "+lastname+" <br>
Welcome To My Page! <br></h1></Center>"); <!-- OUTPUT-->
//-->
</SCRIPT>
</p>
</div>
<tr>
<td><div align="center" class="style3"><strong>First Name </strong></div></td>
<td><div align="center" class="style1">
<script language="javascript">
document.write(firstname);
</script>
</div></td>
</tr>
<tr>
<td><div align="center" class="style2 style1"><strong>Middle Name </strong></div></td>
<td><div align="center" class="style1">
<script language="javascript">
document.write(middlename);
</script>
</div></td>
</tr>
</table>
<p> </p>
<table width="331" border="1" align="center" bordercolor="#FFFF00" >
<tr>
<td width="147"><div align="center" class="style3"><strong>First Name
</strong></div></td>
<td width="168"><div align="center" class="style1">
<script language="javascript">
document.write(firstname);
</script>
</div></td>
</tr>
<tr>
<td><div align="center" class="style3"><strong>Middle Name </strong></div></td>
<td><div align="center" class="style1">
<script language="javascript">
document.write(middlename);
</script>
</div></td>
</tr>
<tr>
<td><div align="center" class="style2 style1"><strong>Last Name </strong></div></td>
<td><div align="center" class="style1">
<script language="javascript">
document.write(lastname);
</script>
</div></td>
</tr>
</table>
<p> </p>
</body>
</HTML>