Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
7 views

Javascript Programs

Java helps

Uploaded by

minhasm9633
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
7 views

Javascript Programs

Java helps

Uploaded by

minhasm9633
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Javascript

Program 1- Area and circumference of a circle


<!Doctype html>
<html>
<head><title>find area and circumference of a circle</title></head>
<body>
<script language="JavaScript">
function CalculateA()
{
var r=parseInt(rad.value);
area.value=(3.14*r*r);
}
function CalculateC()
{
var r=parseInt(rad.value);
cir.value=(2*3.14*r);
}
</script>
<form name=form1>
<table>
<tr><td>
Enter the radius of the circle:</td><td>
<input type="text" name="txtRadius" size=10 id="rad"></td></tr>
<tr><td>
Area
</td><td>
<input type="text" name="txtArea" size=10 id="area"></td></tr>
<tr><td>
Circumference
</td><td>
<input type="text" name="txtCircum" size=10 id="cir"></td></tr>
</table>
<input type="button" value="Calculate Area" onClick="CalculateA()">
<input type="button" value="Calculate Circumference" onClick="CalculateC()">
</form>
</body>
</html>

Program 2- Perfect/Abundant/Deficient
<!Doctype html>
<html>
<head><title>Perfect/Abundant/Deficient</title></head>
<body>
<script language="JavaScript">
function Check()
{
var i,sum=0;
var num=parseInt(number.value);
alert(num);
for(i=1;i<=num/2;i++)
{
if(num%i==0)
sum=sum+i;
}
if(sum==num)
alert("It's a Perfect number");
else
if(sum>num)
alert("It's an Abundant number");
else
alert("It's a Deficient number");
}
</script>
<form name=form1>
<table>
<tr><td>
Enter the Number</td><td>
<input type="text" name="txtnum" size=10 id="number"></td></tr>
<tr><td colspan="2">
<input type="button" value="Check" onClick="Check()">
</td></tr></table>
</form>
</body>
</html>

Program 3-Multiplication table


<html>
<head>
<title>Multiplication Table </title>
<script>
function printTable()
{
alert("hai");
var input=num.value;
var l=parseInt(limit.value);
if(!isNaN(input))
{
var table="";
for(i=1;i<=l;i++)
{
number = input * i;
table += input + " * " + i + "=" + number + "<br/>";
}
document.getElementById("mul").innerHTML= table;
}
else
document.getElementById("mul").innerHTML= "please Enter a valid Number";
}
</script>
</head>
<body>
<form name="frm1">
Enter a limit
<input type="text" name="limit"
id="limit"><br>
Enter a Number
<input type="text" name="num"
id="num"
onchange="printTable()"><br>
<p id="mul">
</form>
</body>
</html>

Program 4-Arithmetic operations using output element


<!Doctype html>
<html>
<head><title>calculate two integers</title></head>
<body>
<form name=form1>
Number 1:
<input id="a" type="text" name="txtInt1"size=10>
<br>
Number 2:
<input id="b" type="text" name="txtInt2"size=10>
<br>
<br><br>
<button onclick="res.value=parseInt(a.value)+parseInt(b.value)">+</button>
<button onclick="res.value=parseInt(a.value)-parseInt(b.value)">-</button>
<button onclick="res.value=parseInt(a.value)/parseInt(b.value)">/</button>
<button onclick="res.value=parseInt(a.value)*parseInt(b.value)">*</button>
<br>
Result:
<output id="res" for="a b" name="res" size=10>
</form>
</body>
</html>

Program5-Change background of a document.form1


<!doctype html>
<html>
<head>
<title>
Change the background color of a document
</title>
</head>
<body>
<button onmouseover="changeBg(0)">Red</button>
<button onmouseover="changeBg(1)">Yellow</button>
<button onmouseover="changeBg(2)">Blue</button>
<button onmouseover="changeBg(3)">Green</button>
<button onmouseover="changeBg(4)">Orange</button>
<button onmouseover="changeBg(5)">Cyan</button>
<script language="javascript">
function changeBg(i)
{
const colors=["red","yellow","blue","Green","orange","cyan"];
document.body.style.background=colors[i];
}
</script>
</body>
</html>
Program 6- Strin Palindrome
<!doctype html>
<head>
<title>
String is palindrome or not
</title>
</head>
<body>
<script type="text/javascript">
function checkPalindrome(str)
{
const len = string.length;
for (let i = 0; i < len / 2; i++)
{
if (string[i] !== string[len - 1 - i])
{
return 'It is not a palindrome';
}
}
return 'It is a palindrome';
}
const string = prompt('Enter a string: ');
const value = checkPalindrome(string);
document.write(value);
</script>
</body>
</html>
Program 7 -Sum of elements of an Array
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Prompt and Alert Pop up box</title>
<script>
function sum()
{
var c=[];
var limit,sum=0;
limit=prompt("Enter number of elements of array");
for(var i=0;i<limit;i++)
{
c[i]=prompt("Enter number");
sum=sum+parseInt(c[i]);
}
alert("The sum of elements of array is"+sum);
}

</script></head>
<body>
<h1 id="heading">Prompt and Alert Dialogue Boxes</h1>
<p> Program to create an Array and read values using Prompt
popup box and display the sum of elements in an Alert Box</p>
<hr>
<div>
<button type="button" onclick="sum()">Sum of elements using array</button>
</div>
<br></body></html>
Program 8- Change backgroung color of a text box
<!Doctype html>
<html>
<head><title>Change backgroung color of a text box</title></head>
<body>
<script language="JavaScript">
function Addition(){
var c=parseInt(a.value)+parseInt(b.value);
document.form1.textResult.value=c;
}
</script>
<form name=form1 onClick=document.body.style.background="red">
<table>
<tr><td>
Enter number 1:
</td><td><input id="a" type="text" name="txtInt1" size=10 onfocus="this.style.color='Green'"
onblur="this.style.background='pink';" ></td></tr>
<br>
<tr><td>
Enter number 2:
</td><td><input id="b" type="text" name="txtInt2" size=10 onfocus="this.style.color='Green'"
onblur="this.style.background='pink';"></td></tr>
<br>
<tr><td>
Result:
<input id="c" type="text" name="textResult" size=10>
<br>
</td></tr>
<tr><td>
<input type="button" value="+" onClick="Addition();">
</td></tr>
</form>
</body>
</html>
Program 9- Display the capital
<html>
<head><title>To Display the Capital</title></head>
<body>
Select a country :
<select id="countries" onchange=getCapital()>
<option value="0">Australia</option>
<option value="1">Poland</option>
<option value="2">Mexico</option>
<option value="3">Germany</option>
<option value="4">India</option>
</select>
<br/><br/>
Capital: <input type="text" id="txtbox">
<script>
function getCapital() {
var capitals=["Canberra","Warsaw","Mexico City","Berlin","New Delhi"];
var i = document.getElementById("countries").selectedOptions[0].value;
document.getElementById("txtbox").value = capitals[i];
}
</script>
</body>
</html>
Program 10-Loginform validation
<html>
<body>
<script>
function validateform()
{
var name=n1.value;
var password=p1.value;
var cpass=c1.value;
if (name==null || name=="")
{
alert("Name can't be blank");
return false;
}
if(password.length<8)
{
alert("Password must be at least 8 characters long.");
return false;
}
if(password!=cpass)
{
alert("Both password and Confirm password must be same");
return false;
}
}
</script>
<body>
<form name="myform" method="post"
action="Confirm.html" onsubmit="return validateform()" >
<table>
<tr><td>Name:</td>
<td><input type="text" name="name" id="n1"></td></tr>
<tr><td>Password</td>
<td><input type="password" name="password" id="p1"></td></tr>
<tr><td>Confirm Password</td>
<td><input type="password" name="cpassword" id="c1"></td></tr>
<tr><td><input type="submit" value="register"></td></tr></table>
</form>
</body>
</html>

Confirm.html

<!doctype html>
<html>
<head>
<title>Confirmation page</title>
</head>
<body>
<H1> You are a valid user </H!>
</body>
</html>

You might also like