SOP 1(javascript) Part 1 (Using Button)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Different colors</title>
</head>
<body>
<form>
<input type="button" name="b1"
value="on mouse over magic"
onMouseOver="change()">
<input type="button" name="b2"
value="Display message"
onClick="display()">
</form>
<script type ="text/javascript">
function change()
{
[Link]="red";
[Link]("f1()",500);
}
function f1()
{
[Link]="blue";
[Link]("f2()",1500);
}
function f2()
{
[Link]="green";
[Link]("f3()",1500);
}
function f3()
{
[Link]="indigo";
[Link]("f4()",1500);
}
function f4()
{
[Link]="yellow";
[Link]("f5()",1500);
}
function f5()
{
[Link]="orange";
[Link]("f6()",1500);
}
function f6()
{
[Link]="violet";
[Link]("f7()",1500);
}
function f7()
{
[Link]="white";
[Link]("change()",1500);
}
function display()
{
confirm("All Seven Color displayed");
}
</script>
</body>
</html>
SOP 1(javascript) Part 2 (Automatically)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Different colors</title>
</head>
<body onload="change()">
<script type ="text/javascript">
function change()
{
[Link]="red";
[Link]("f1()",500);
}
function f1()
{
[Link]="blue";
[Link]("f2()",500);
}
function f2()
{
[Link]="green";
[Link]("f3()",500);
}
function f3()
{
[Link]="indigo";
[Link]("f4()",500);
}
function f4()
{
[Link]="yellow";
[Link]("f5()",500);
}
function f5()
{
[Link]="orange";
[Link]("f6()",500);
}
function f6()
{
[Link]="violet";
[Link]("f7()",500);
}
function f7()
{
[Link]="white";
[Link]("change()",500);
}
}
</script>
</body>
</html>
SOP 2 (Vowels)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Vowels</title>
</head>
<body>
<form>
Enter String
<input type="text" id="t1">
<br><br>
<center>
<input type="submit" value="check vowels" onClick="vowels()">
</form>
<script type="text/javascript">
function vowels()
{
var count = 0;
var a = [Link]("t1").value;
var s = [Link]();
var b=[Link]();
for (var i = 0; i<[Link]; i++)
{
if ([Link](i) == "a"
|| [Link](i) == "e"
|| [Link](i) == "i"
|| [Link](i) == "o"
|| [Link](i) == "u")
{
count =count+1;
}
}
[Link]("Total Vowels : "+count);
}
</script>
</body>
</html>
SOP 4 (Grade Calculator)
<!doctype html>
<html lang="en">
<head>
<title>javascript grade program</title>
</head>
<body style="background-color:cyan">
<h1 style="text-align:center;color:red;text-decoration:underline">Average Marks and
Grade</h1>
<h2>
<script type="text/javascript">
var a,b,c,d,e,f,tm,avg;
a=parseInt(prompt("Enter English marks "));
b=parseInt(prompt("Enter Hindi marks "));
c=parseInt(prompt("Enter Physics marks "));
d=parseInt(prompt("Enter Maths marks "));
e=parseInt(prompt("Enter Chemistry marks "));
f=parseInt(prompt("Enter Biology marks "));
[Link]("<br>ENGLISH MARKS = "+a);
[Link]("<br>HINDI MARKS = "+b);
[Link]("<br>PHYSICS MARKS = "+c);
[Link]("<br>MATHS MARKS = "+d);
[Link]("<br>CHEMISTRY MARKS = "+e);
[Link]("<br>BIOLOGY MARKS = "+f);
tm=(a+b+c+d+e+f);
[Link]("<br>TOTAL MARKS = "+tm);
avg=tm/6;
[Link]("<br>AVERAGE MARKS = "+avg);
if((avg>=35)&&(avg<=60))
[Link]("<br> Grade = F");
else if((avg>=61)&&(avg<=70))
[Link]("<br> Grade = D");
else if((avg>=71)&&(avg<=80))
[Link]("<br> Grade = C");
else if((avg>=81)&&(avg<=90))
[Link]("<br> Grade = B");
else if((avg>=91)&&(avg<=100))
[Link]("<br> Grade = A");
else
[Link]("<br> Invalid");
</script>
</h2></body></html>
SOP 3 (Temperature Convertor)
<!DOCTYPE html>
<html>
<head>
<title>Temperature</title>
</head>
<body>
<input type="number" id="c1" placeholder="Temperature in Celsius">
<input type="submit" value="To Fahrenheit" onClick="Fahrenheit()">
<br><br>
<input type="number" id="f1" placeholder="Temperature in Fahrenheit">
<input type="submit" value ="To Celcius" onClick="Celsius()">
<script type="text/javascript">
function Fahrenheit()
{
var c = parseInt([Link]('c1').value);
[Link]("In Celcius = "+c);
var f;
f = ((c/5)*(9))+32;
[Link]("<br><br> In Fahrenheit : "+f);
}
function Celsius()
{
var f = parseInt([Link]('f1').value);
[Link]("In Fehrenheit = "+f);
var c;
c = ((f-32)/9)*5;
[Link]("<br><br> In Celsius : "+c);
}
</script>
</body>
</html>