Web Programming Lab MCA 4TH Sem
Web Programming Lab MCA 4TH Sem
Page 1
NIZAM COLLEGE
<html >
<head>
<title> WWW How to Program - Image Linking </title>
</head>
<body>
<p>
<a href = "nature.html">
<img src = "nature.bmp" width = "200" height = "200" alt = "NATURE" />
</a>
Page 2
NIZAM COLLEGE
Page 3
NIZAM COLLEGE
Page 4
NIZAM COLLEGE
Page 5
NIZAM COLLEGE
Page 6
NIZAM COLLEGE
<html>
<head>
<title>How to Program - Nested unordered list</title>
</head>
<body>
<center> <h1><font color="#3333FF"> The Parts of the Computer :</font> </h1> <br>
<ul>
<li> <font color="#CC0000"> Monitor models </font> </li><br>
<ul>
<li> <font color="#990033"> SAMSUNG</font></li><br>
<li> <font color="#990033">PHILIPS </font></li><br>
<li> <font color="#990033">LG </font></li><br>
<li> <font color="#990033">SONY </font></li><br><br>
</ul>
<li> <font color="#CC0000"> Mother boards </font> </li><br>
<ul>
<li><font color="#990033">Mercury</font></li><br>
<li><font color="#990033">Intel </font></li><br>
<LI> <font color="#990033">ASUS </font></LI><br>
<ol>
<li> <font color="#FF66FF"> Pentium 1</font> </li><br>
<li> <font color="#FF66FF"> Pentium
2</font></li><br>
Page 7
NIZAM COLLEGE
Page 8
NIZAM COLLEGE
</body>
</html>
Page 9
NIZAM COLLEGE
Page 10
NIZAM COLLEGE
Page 11
NIZAM COLLEGE
Page 12
NIZAM COLLEGE
Page 13
NIZAM COLLEGE
Page 14
NIZAM COLLEGE
8.Write a HTML program using FRAMESET Tag to first divide the web page into
two columns and column bottom row having the main page with text .The left
host column with some other images
<frameset rows="2%,*">
<frameset cols="55%,*">
<frameset src="am.html">
</frameset>
<frameset rows="100%,*">
<frameset cols="45%,*">
<frame src="WELCOME.html">
<frame src="About AntiVirus.html">
</frameset>
</frameset>
Page 15
NIZAM COLLEGE
9.Write a HTML program using java script to analyse examination result of a class
of 10 students. If no. of students passed in that class in greater than no. of
students failed then display the text 'GOOD RESULT'.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Students Marks Information</title>
<script language="javascript">
var s = 0;
var f = 0;
function ones()
{
var p,q,r,m1,m2,m3,sum;
var i=1;
alert("Record is Updated , Successfully ");
p = document.marks.t1.value;
q = document.marks.t2.value;
r = document.marks.t3.value;
m1 = parseInt(p);
m2 = parseInt(q);
m3 = parseInt(r);
if(m1>100 || m2>100 || m3>100 || m1<=0 || m2<=0 || m3<=0)
{
alert("Incorrect Entries , please check the MARKS ");
Page 16
NIZAM COLLEGE
return;
}
sum = (m1+m2+m3);
document.marks.t6.value = sum;
if(m1>=35 && m2>=35 && m3>=35)
{
document.marks.t4.value = ("Student has been passed");
s = s+1;
}
else
{
document.marks.t4.value = ("Student has been failed");
f = f+1;
}
if(s > f)
{
document.marks.t5.value = (" Good Result ! ");
}
else if(s==f)
{
document.marks.t5.value = (" Balanced Result ! ");
Page 17
NIZAM COLLEGE
}
else
{
document.marks.t5.value = (" Bad Result ! ");
}
</script>
</head>
<body bgcolor="#FF33CC">
<form name="marks">
<center> <br /> <br /> <br /><table height="481" border cellpadding = 10> <tr align = center>
<td bgcolor = #CC3399> <h3> <u> STUDENT MARKS SHEET <br /> </u> </h3>
<b> Enter 1st subject marks : </b> <input type="text" size="30" name="t1" /><br /> <br />
<b> Enter 2nd subject marks : </b> <input type="text" size="30" name="t2" /><br /> <br />
<b> Enter 3rd subject marks : </b> <input type="text" size="30" name="t3" /><br /> <br />
<input type="button" value="Next_Record" onClick="ones()" /> <br> <br>
<b> Total Marks : </b> <input type="text" name="t6" size="50"> <br> <br>
<b> Result : </b> <input type="text" name="t4" size="50">
<br> <br>
<b> Total Result : </b> <input type="text" name="t5" size="50">
<input type="text" name="t7" size="50">
</td> </tr> </table> </center> </form>
</body>
</html>
Page 18
NIZAM COLLEGE
Fig : StudentMarks.html
Page 19
NIZAM COLLEGE
<html>
<head>
<script type="text/javascript">
function show_alert()
{
alert("Hello! I am an alert box!");
var ab = prompt("Enter your name: ",null);
document.info.b1.value = "hai "+ab;
}
</script>
</head>
<body>
<form name="info">
<input type="text" size="30" name="b1">
<input name="button" type="button" onClick="show_alert()" value="Show alert box" />
</form></body>
</html>
Page 20
NIZAM COLLEGE
Page 21
NIZAM COLLEGE
<html>
<head>
<script language="JavaScript">
function adding()
{
var nu1=document.form1.num1.value;
var nu2=document.form1.num2.value;
var nu3=document.form1.num3.value;
var number1=parseFloat(nu1);
var number2=parseFloat(nu2);
var number3=parseFloat(nu3);
var number4 = (number1+number2+number3);
document.form1.t3.value = ("Addition of "+number1+" , "+number2+" and "+number3+" is "+number4);
}
function Findingmin()
{
var nu1=document.form1.num1.value;
var nu2=document.form1.num2.value;
var nu3=document.form1.num3.value;
var number1=parseFloat(nu1);
var number2=parseFloat(nu2);
Page 22
NIZAM COLLEGE
var number3=parseFloat(nu3);
if(number1==number2 || number1==number3 || number2==number3)
{
document.form1.t3.value = (" Enter differenet values and try again"); }
else if(number1<number2 && number1<number3)
{
document.form1.t3.value = (" In "+number1+" and "+number2+" and "+number3+"
"+number1+" is Smellest Number");
}
else if(number2<number1 && number2<number3)
{
document.form1.t3.value = (" In "+number1+" and "+number2+" and "+number3+"
"+number2+"is Smellest Number");
}
else if(number3<number1 && number3<number2)
{
document.form1.t3.value = (" In "+number1+" and "+number2+" and "+number3+"
"+number3+"is Smellest Number");
}
else { return; }
}
function maxing()
{
var nu1=document.form1.num1.value;
var nu2=document.form1.num2.value;
var nu3=document.form1.num3.value;
var number1=parseFloat(nu1);
Page 23
NIZAM COLLEGE
var number2=parseFloat(nu2);
var number3=parseFloat(nu3);
if(number1==number2 || number1==number3 || number2==number3)
{
document.form1.t3.value = (" Enter differenet values and try again ");
}
else if(number1>number2 && number1>number3)
{
document.form1.t3.value = (" In "+number1+" and "+number2+" and "+number3+"
"+number1+" is Greater");
}
else if(number2>number1 && number2>number3)
{
document.form1.t3.value = ("In "+number1+" and "+number2+" and "+number3+"
"+number2+"is Greater");
}
else if(number3>number1 && number3>number2)
{
document.form1.t3.value = (" in "+number1+" and "+number2+" and "+number3+"
"+number3+"is Greater");
}
}
function avera()
{
var nu1=document.form1.num1.value;
var nu2=document.form1.num2.value;
var nu3=document.form1.num3.value;
Page 24
NIZAM COLLEGE
var number1=parseFloat(nu1);
var number2=parseFloat(nu2);
var number3=parseFloat(nu3);
var aver = ((number1+number2+number3)/3);
document.form1.t3.value = ("AVERAGE of "+number1+" - "+number2+" - "+number3+" is :: "+aver);
}
function prod()
{
var nu1=document.form1.num1.value;
var nu2=document.form1.num2.value;
var nu3=document.form1.num3.value;
var number1=parseFloat(nu1);
var number2=parseFloat(nu2);
var number3=parseFloat(nu3);
var pro = (number1*number2*number3);
document.form1.t3.value = ("PRODUCT of "+number1+" - "+number2+" - "+number3+" is :: "+pro);
}
</script>
</head>
<body>
<form name=form1>
<b> First Number : </b> <input type=number name="num1" value="0"> <br> <br>
<b> Second Number : </b> <input type=number name="num2" value="0"> <br> <br>
<b> Third Number : </b> <input type=number name="num3" value="0"> <br> <br>
<center>
Page 25
NIZAM COLLEGE
Page 26
NIZAM COLLEGE
Page 27
NIZAM COLLEGE
<html>
<HEAD>
<title> FINDING FACTORIAL OF NUMBER </title>
<script language=JavaScript>
var factorial=1;
function FACTS()
{
var max = document.info.b1.value;
for(var loopIndex=1;loopIndex<=max;loopIndex++)
{
factorial=factorial * loopIndex;
document.info.t1.value = (loopIndex +" ! = "+factorial);
}
}
</script>
</HEAD>
<body>
<form name="info"> <center> <h1> FINDING FACTORIAL VALUE OF THE GIVEN NUMBER </h1>
</center>
Enter Number : <input type="text" size="20" name="b1"> <input
type="button" value="Find Factorial" onClick="FACTS()">
<BR> <textarea rows="10" cols="50" name="t1"> </textarea>
</form>
Page 28
NIZAM COLLEGE
</body>
</html>
Page 29
NIZAM COLLEGE
Page 30
NIZAM COLLEGE
Page 31
NIZAM COLLEGE
15.Write a HTML program using java script to sum of even integers from 2 to 100.
document.writeln("<br> <h3> Sum of even numbers from 2 to 100 is: </h3> <h1>"+j+"</h1>");
}
</script>
</head>
<body onLoad ="sumeven()">
</body>
</html>
Page 32
NIZAM COLLEGE
Page 33
NIZAM COLLEGE
16.Write a HTML program using java script to search an array of elements using
linear search
17.Write a HTML program using java script to search an element in an array
element using binary search
<html >
<head>
<title>Linear Search of an Array</title>
<script type = "text/javascript">
<!--
Page 34
NIZAM COLLEGE
</script>
</head>
<body>
<form name = "searchForm" action = ""> <h3> <center> ARRAY contains 2 multiplicants upto 200
</center> </h3>
<p>Enter integer search key<br />
<input name = "inputVal" type = "text" />
<input name = "search" type = "button" value = "Search" onclick = "buttonPressed()" /> <br /> </p>
<p> Result <br />
<input name = "result" type = "text" size = "30" /> </p>
</form>
</body>
</html>
Page 35
NIZAM COLLEGE
Page 36
NIZAM COLLEGE
18.Write a HTML program using java script to demonstrate Date and Time
methods.
<html>
<head>
<title>Date and Time Methods</title>
<script language = "javascript">
<!-var current = new Date();
document.writeln( "<h1>String representations and valueOf</h1>" );
document.writeln( "toString: " + current.toString() +
"<br>toLocaleString: " + current.toLocaleString() +
"<br>toUTCString: " + current.toUTCString() +
"<br>valueOf: " + current.valueOf() );
Page 37
NIZAM COLLEGE
current.getTimezoneOffset() );
document.writeln(
"<h1>Specifying arguments for a new Date</h1>" );
var anotherDate = new Date( 2001, 2, 18, 1, 5, 0, 0 );
document.writeln( "Date: " + anotherDate );
document.writeln("<h1>Set methods for local time zone</h1>" );
anotherDate.setDate( 31 );
anotherDate.setMonth( 11 );
anotherDate.setFullYear( 2001 );
anotherDate.setHours( 23 );
anotherDate.setMinutes( 59 );
anotherDate.setSeconds( 59 );
document.writeln( "Modified date: " + anotherDate );
// -->
</script>
</head><body></body>
</html>
Page 38
NIZAM COLLEGE
Page 39
NIZAM COLLEGE
19.Write a HTML program to demonstrate aligning text and setting box dimension
using CSS.
<html>
<head>
<title>Borders</title>
{ text-align: center;
margin-bottom: .3em;
width: 50%;
position: relative;
left: 25%;
padding: .3em }
</style>
</head>
<body>
<div style = "border-style: solid">Solid border</div>
<div style = "border-style: double">Double border</div>
<div style = "border-style: groove">Groove border</div>
<div style = "border-style: ridge">Ridge border</div>
<div style = "border-style: inset">Inset border</div>
<div style = "border-style: outset">Outset border</div>
</body>
</html>
Page 40
NIZAM COLLEGE
Page 41
NIZAM COLLEGE
Page 42
NIZAM COLLEGE
Page 43
NIZAM COLLEGE
<script type="text/javascript">
function mymessage()
{
alert("This message was triggered from the onload event");
Page 44
NIZAM COLLEGE
}
</script>
</head>
<body>
<body onload="mymessage()">
<img id="myimage" onclick="changeimage()" border="0" src="bulboff.jpg" height=100 width=100 />
<p>Click to turn on/off the light</p>
</body>
</html>
Page 45
NIZAM COLLEGE
Page 46
NIZAM COLLEGE
function message()
{
adddlert("Welcome guest!");
}
</script>
</head>
<body>
<input type="button" value="View message" onclick="message()" />
Page 47
NIZAM COLLEGE
</body>
</html>
Page 48
NIZAM COLLEGE
<script type="text/javascript">
function lighton()
{
document.getElementById('myimage').src="bulbon.jpg";
}
function lightoff()
{
document.getElementById('myimage').src="bulboff.jpg";
}
</script>
</head>
Page 49
NIZAM COLLEGE
<body onmousemove="moveright()">
<h1 id="header">
Move the mouse over this page
</h1>
<h1 onMouseOver="style.color='red'"
onmouseout="style.color='black'">
Mouse over this text</h1>
</body>
</html>
Page 50
NIZAM COLLEGE
Page 51
NIZAM COLLEGE
td { border-style: groove;
padding: 1ex }
</style>
</head>
<body>
<table>
Page 52
NIZAM COLLEGE
<tr>
<!-- Filters are applied in style declarations -->
<td style = "filter: fliph">Text</td>
<td>Text</td>
</tr>
<tr>
<!-- More than one filter can be applied at once -->
<td style = "filter: flipv fliph">Text</td>
<td style = "filter: flipv">Text</td>
</tr>
</table>
</body>
</html>
Page 53
NIZAM COLLEGE
25.
-->
function runDemo()
{
shadowText.innerText =
"Shadow Direction: " + shadowDirection % 360;
shadowText.filters( "shadow" ).direction =
( shadowDirection % 360 );
shadowDirection += 45;
Page 54
NIZAM COLLEGE
}
// -->
</script>
</head>
Page 55
NIZAM COLLEGE
Page 56
NIZAM COLLEGE
</BODY>
</HTML>
Page 57
NIZAM COLLEGE
Page 58
NIZAM COLLEGE
document.write("<u><b>InStrRev Demo</b></u>")
document.write("<br>")
pos=InStrRev(txt,"his")
document.write(pos)
Page 59
NIZAM COLLEGE
document.write("<br>")
'textual comparison
pos=InStrRev(txt,"B",-1,1)
document.write(pos)
document.write("<br>")
'binary comparison
pos=InStrRev(txt,"T")
document.write(pos)
document.write("<br>")
'binary comparison
pos=InStrRev(txt,"t")
document.write(pos)
document.write("<br>")
document.write("<u><b>Length of Text</u></b>")
document.write("<br>")
document.write(Len(txt))
document.write("<br>")
MASTER OF COMPUTER APPLICATION
Page 60
NIZAM COLLEGE
document.write("<u><b>LTrim</u></b>")
document.write("<br>")
document.write(LTrim(txt))
document.write("<br>")
document.write("<u><b>RTrim</u></b>")
document.write("<br>")
document.write(RTrim(txt))
document.write("<br>")
document.write("<u><b>Trim</u></b>")
document.write("<br>")
document.write(Trim(txt))
document.write("<br>")
document.write("<u><b>Replace</b></u>")
document.write("<br>")
document.write(Replace(txt,"beautiful","horrible"))
document.write("<br>")
document.write("<u><b>Right</b></u>")
document.write("<br>")
document.write(Right(txt,11))
document.write("<br>")
</SCRIPT>
</HEAD>
MASTER OF COMPUTER APPLICATION
Page 61
NIZAM COLLEGE
<BODY>
</BODY>
</HTML>
Page 62
NIZAM COLLEGE
<HTML>
<HEAD>
<TITLE> Sum of 2 numbers using VB-SCRIPT</TITLE>
<!-Option Explicit
//declaration
Dim num1
Dim num2
Dim sum
//document.write(" <center> <h2> PROGRAM TO FIND SUM OF TWO NUMBERS USING VB-SCRIPT
</h2> </center> ");
num1=InputBox("Enter an integer", "Input Box", , 1000, 1000)
num2=InputBox("Enter an integer", "Input Box", , 1000, 1000)
sum = CInt(num1)+CInt(num2)
document.write("Addition of "+num1+" and "+num2+" is : " &sum)
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
Page 63
NIZAM COLLEGE
Page 64
NIZAM COLLEGE
<html>
<head>
<title>Using a VBScript Class</title>
Class Person
Private name, yearsOld, ssn
Page 65
NIZAM COLLEGE
Age = yearsOld
End Property
If Validate( n ) Then
ssn = n
Else
ssn = "000-00-0000"
Call MsgBox( "Invalid Social Security Format" )
End If
End Property
regularExpression.Pattern = "^\d{3}-\d{2}-\d{4}$"
Page 66
NIZAM COLLEGE
End If
End Function
Sub cmdButton_OnClick()
Dim p
With p
.FirstName = Document.Forms(0).txtBox1.Value
.Age = CInt( Document.Forms(0).txtBox2.Value )
.SocialSecurityNumber =_
Document.Forms(0).txtBox3.Value
Call MsgBox( .ToString() )
End With
End Sub
-->
</script>
</head>
Page 67
NIZAM COLLEGE
<body>
<form action = "">Enter first name
<input type = "text" name = "txtBox1" size = "10" />
<p>Enter age
<input type = "text" name = "txtBox2" size = "5" /></p>
<p>Enter social security number
<input type = "text" name = "txtBox3" size = "10" />
</p><p>
<input type = "button" name = "cmdButton"
value = "Enter" /></p>
</form>
</body>
</html>
Page 68
NIZAM COLLEGE
30.Write a HTML program to demonstrate the forms by reading the name of the
user from the form.
<html><head><title>VBScript Class Example</title>
<script type="text/vbscript">
Option Explicit
Class Person
ssn = n
Else
ssn = "000-00-0000"
Call MsgBox("Invalid Social Security Format")
End If
End Property
Public Property Get SocialSecurityNumber()
Page 69
NIZAM COLLEGE
SocialSecurityNumber = ssn
End Property
Private Function Validate (expression)
Dim regularExpression
regularExpression.Pattern = "^\d{3}-\d{2}-\d{5}$"
If regularExpression.Test(expression) Then
Validate = True
Else
Validate = False
End If
End Function
Public Function ToString( )
ToString = name & Space( 3 ) & age & Space( 3 ) & ssn
End Function
End Class
Sub cmdButton_OnClick()
Dim p
Page 70
NIZAM COLLEGE
<body>
<h3>Example using VBScript Class definitions and Regular Expressions</h3>
Enter a value in each field.
Person is defined as a class with Name, Age and Social Security Number.
See the source code for details.
<form action = "">Enter first name
<input type=text name=txtBox1 size=10>
<p>Enter age
<input type=text name=txtBox2 size=5></p>
<p>Enter social security number
<input type=text name=txtBox3 size=10></p><p>
<input type=button name=cmdButton value=Enter></p>
</form><div style="display: block; font-family: Verdana, Geneva, Arial; font-size: 10px">
The University of Southern California does not screen or control the content on this website and thus
does not guarantee the accuracy, integrity, or quality of such content. All content on this website is
provided by and is the sole responsibility of the person from which such content originated, and such
content does not necessarily reflect the opinions of the University administration or the Board of
Trustees
</div>
</body></html>
Page 71
NIZAM COLLEGE
Page 72