lab4-js
lab4-js
Azzam Hadba
Lab4: JavaScript
For Loop
<SCRIPT LANGUAGE="JavaScript">
var sum=0;
var number= 100;
for (i=1; i <=number; i++) {
sum=sum + i ;
document.write("For i = ", i, " ---> sum = " , sum , "<BR>");
}
</SCRIPT>
User input
<HTML>
<HEAD> <TITLE> Example 6</TITLE> </HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
var Fname="", myclass="" ;
Fname=prompt( "Enter your first name","");
myclass=prompt( "Enter your class","");
if ( Fname !="" && myclass !="")
document.write("Good Morning ", Fname," ! <BR> Are you happy in class ", myclass, " ?")
else
alert("Please enter your data !");
</SCRIPT>
</BODY>
</HTML>
Form Control
The following HTML code create a button with the text "Display". Once the user click on this button,
the function display() is called.
<html>
<head>
<script language="javascript">
function display()
{
if(myfrom.a.value=="" || myfrom.b.value=="")
alert("All fields should be filled");
else
alert("Good morning "+ myfrom.a.value+ " , you have "+ myfrom.b.value + " years old");
}
function fill()
{
myfrom.c.value=Math.floor(100*Math.random());
}
</script>
</head>
<body onload="fill()">
Web development lab 2022 ULFG1 Dr. Nada Chendeb - Eng. Azzam Hadba
<form name="myfrom">
<b>Name</b> <input name ='a' type= 'text'>
<b>Age</b> <input name ='b' type= 'text'>
<b>random id</b> <input name ='c' type= 'text'>
<br><br>
<input type='button' value='display' onclick='display()'>
</form>
</body>
</html>
Exercise1-Multiplication table
a- Write the JavaScript code that displays in your html page the below multiplication table
b- Enhance your program by letting the user enter a number >1, then you display the multiplication
table from 1 to the entered number.
Exercise 2 – Simple Calculator
In an e-learning website, we need to check the students’ knowledge regarding 4 basic math
operations. The following exercise is then proposed to the students:
Web development lab 2022 ULFG1 Dr. Nada Chendeb - Eng. Azzam Hadba
1. When the page is loaded, the two numbers A and B are given, these are two random integers
between 1 and 100. The student should enter the answer of the four operations in their corresponding
textboxes. After that the student could check his answers by clicking on the button “verifier”. The
verification process is called if and only if the four fields are filled by integer numbers. If not, the
student is asked to fill all fields by valid numbers.
2. If the student wants to get the correct answers, he can click on the button “OK”. So a new function
is called to display the correct answer in the last line (the textboxes are disabled, therefore the user
cannot edit them)
Hint
var cnd1= ….;
var cnd2=… ;
var cnd3=… ;
var cnd4=… ;
if((cnd1)&&(cnd2)&&(cnd3)&&(cnd4))
alert("Very good! Your answers are all correct!");
else
alert("Pay attention! There was an error in your answer. Recalculate again");
}