0% found this document useful (0 votes)
112 views19 pages

1) Write An Application To Implement Basic Tags in HTML

The document provides code snippets for 18 web technology lab manual exercises involving HTML and JavaScript. The exercises cover implementing basic HTML tags, lists, forms, images, tables, stylesheets, frames, and links. Additional JavaScript exercises include performing mathematical operations, checking even/odd numbers, converting between binary and decimal, checking for right triangles, checking prime numbers, and converting between Celsius and Fahrenheit.

Uploaded by

ulasalasreenath
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
112 views19 pages

1) Write An Application To Implement Basic Tags in HTML

The document provides code snippets for 18 web technology lab manual exercises involving HTML and JavaScript. The exercises cover implementing basic HTML tags, lists, forms, images, tables, stylesheets, frames, and links. Additional JavaScript exercises include performing mathematical operations, checking even/odd numbers, converting between binary and decimal, checking for right triangles, checking prime numbers, and converting between Celsius and Fahrenheit.

Uploaded by

ulasalasreenath
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 19

WEB-TECHOLOGIES

LAB MANAUVAL

1)Write an application to implement basic tags in HTML. Basic.html:


<html> <head> <title>using all tags in html</title> </head> <body text="black">

<B><I><U><H1><CENTER>welcome</CENTER></H1></U></I></B> this is paragraph starting.<p>we can break the line also by using br tag<BR>this is after breaking the line. <hr size=2 width=80% align="center" color="blue" ><BR>the above is special horizontal line<br> <HR><BR>this is default horizontal line<BR> <marquee direction="left" scrollamount=50 loop=50 behavior="alternate" hspace=50 vspace=20>this is marquee</marquee> <FONT SIZE="2" color="green">hi! this is font</FONT><br> this is ordered list </body> </Html>

2)Write an application to implement lists type in HTML.


<html> <body bgcolor="#CCBBDD"> <h3>This demonstrates Unordered List</h3> <ul Type=circle></ul> <font size=+2 ></font>

<LI>jsp <LI>servlet <LI>jdbc </ul> <h3>This demostrates ordered list</h3>

<OL type="A"> <font size=+2></font> <LI>jsp <LI>servlet <LI>jdbc </OL> <h3>Program demonstrating definition list</h3> <font size=+2></font> <DL> <DT>jsp <DD>java server page <DT>servlet <DD>server side programing <DT>jdbc <DD>java database connectivity </DL> </body>

</html>

3)Write an application to implememt forms in HTML. Forms.html:


<HTML> <BODY> <h2>Usage of forms</h2>

<form method=get> Enter your name:<INPUT TYPE="text" NAME="name"><BR> Enter your address:<INPUT TYPE="text" NAME="address"><BR> Enter your password:<INPUT TYPE="password" NAME="password"> Your ideas:<TEXTAREA NAME="name" ROWS="2" COLS="30">Used for large texts. </TEXTAREA> <INPUT TYPE="submit" value="submit"> </BODY> </HTML>

4)Write an application to implememt checkbox in HTML. Checkbox.html:


<HTML> <BODY> <h2>Usage of check box in froms.</h2> <form method="get"> Courses completed:<br> SSC<input type=checkbox name="a1" value="ssc" checked><BR> Intermediate<input type=checkbox name="a2" value="inter"><BR> B.tech<input type=checkbox name="a" value="B.tech"><BR> M.tech<input type=checkbox name="a" value="Mtech"> </BODY> </HTML>

5)Write an application to implemement radio button in HTML. Radiobutton.html:

<HTML> <BODY> <h2>Usage of radio button in forms.</h2> <form method="get"> Select your gender:<br> <input type="radio" name="a" value="m">Male<BR> <input type="radio" name="a" value="f">Female<BR> Select your branch:<br> <input type=radio name="b" value="cse">cse<BR> <input type=radio name="b" value="ece">ece </BODY> </HTML>

6)Write an application to implement frames in HTML. Frames.html:


<HTML> <h2>Implementation of frames.</h2> <frameset rows="25%,75%"> <frame src="frame1.html"> <frameset cols="50%,*"> <frame src="frame2.html"> <frame src="frame3.html"> </frameset> </frameset> </HTML>

Frame1.html:
<HTML> <BODY>

This is frame1 source page </BODY> </HTML>

Frame2.html:
<HTML> <BODY> This is frame2 source page </BODY> </HTML>

Frame3.html:
<HTML> <BODY> This is frame3 source page </BODY> </HTML>

7)Write an application to implement images in HTML. Image.html:


<HTML> <BODY background="img.jpg"> <h2>Usage of image tag and image as background</h2> <img src="image1.gif" height="200" wodth="300"> <img src="image2.gif" alt="it is displayed when cursor placed on it"> </BODY> </HTML>

8)Write an application to implement table in HTML. Table.html:


</html>

<U>SHOWING TIME TABLE USING TABLES</U><BR><BR> <TABLE BORDER=1> <TR> <TD>Day</TD> <TD>PERIOD1</TD> <TD>PERIOD2</TD> <TD>PERIOD3</TD> <TD ROWSPAN=7>B<BR>R<BR>E<BR>A<BR>K</TD> <TD>PERIOD4</TD> <TD ROWSPAN=7>L<BR>U<BR>N<BR>C<BR>H</TD> <TD>PERIOD5</TD> <TD>PERIOD6</TD> <TD>PERIOD7</TD> </TR> <TR> <TD>MONDAY</TD> <TD>ES</TD> <TD>NP</TD> <TD>ACA</TD> <TD>DMDW</TD> <TD>SPM</TD> <TD>WT</TD> <TD>COMPASS</TD> </TR> <TR> <TD>TUESDAY</TD> <TD>WT</TD> <TD>ES</TD> <TD>NP</TD> <TD>ACA</TD> <TD>DMDW</TD> <TD>SEMINAR</TD> <TD>SPM</TD> </TR> <TR> <TD>WEDNESDAY</TD> <TD>SPM</TD> <TD>NP</TD>

<TD>DMDW</TD> <TD>ACA</TD> <TD COLSPAN=3 ALIGN=CENTER>NP LAB</TD> </TR> <TR> <TD>THURSDAY</TD> <TD>ACA</TD> <TD>NP</TD> <TD>SPM</TD> <TD>ES</TD> <TD>WT</TD> <TD>SEMINAR</TD> <TD>DMDW</TD> </TR> <TR> <TD>FRIDAY</TD> <TD COLSPAN=3 ALIGN=CENTER>WT LAB</TD> <TD>SPM</TD> <TD>ACA</TD> <TD>NP</TD> <TD>ES</TD> </TR> <TR> <TD>SATURDAY</TD> <TD>WT</TD> <TD>SPM</TD> <TD>ENGLISH</TD> <TD>ES</TD> <TD>DMDW</TD> <TD>NP</TD> <TD>ACA</TD> </TR> </TABLE> </BODY></HTML>

9)Write an application to imlement stylesheets in HTML.

Stylesheets.html:
<HTML> <head> <style type=text/css> <!-h2{color:red} --> </style> </head> <BODY> <h2> usage of embedded style sheets</h2> <h3 style="background-color:#CC3333">this is inline stylesheet</h3> </BODY> </HTML>

10)Write an application to implement dropdown list in HTML. Dropdown.html:


<HTML> <BODY> <h2>usage of drop down list</h2> selct your branch:<select size=1 name="a"> <option>ECE</option> <option SELECTED>CSE</option>

<option>IT</option> <option>EEE</option> <option>MEC</option> <option>EIE</option> <option>CIVIL</option> </SELECT> </BODY> </HTML>

11)Write an application to implement links in HTML. Links.html:


<HTML> <BODY> <h2>usage of links using anchor tag</h2> <h3><a name="a">links:</a></h3> <a href="stylesheet.html">local link</a><BR> if u click this <a href="#a">links </a> it will go to the above internal link heading. </BODY> </HTML>

12)Write an application to perform addition, average, product, smallest, largest on 3 numbers using java script. Operations.html:
<HTML> <HEAD><CENTER> </center></HEAD> <SCRIPT LANGUAGE="JAVASCRIPT"> function fadd_click() { accept();

document.f1.c.value=eval(x)+eval(y)+eval(z); } function fdiff_click() { accept(); document.f1.c.value=(eval(x)+eval(y)+eval(z))/3; } function fmult_click() { accept(); document.f1.c.value=eval(x)*eval(y)*eval(z); } function fSmall() { accept(); if((x<y) && (x<z) ) document.f1.c.value=x; else if((y<x) && (y<z)) document.f1.c.value=y; else if((z<y) && (z<x)) document.f1.c.value=z; } function fLarge() { accept(); if((x>y) && (x>z) ) document.f1.c.value=x; else if((y>x) && (y>z)) document.f1.c.value=y; else if((z>y) && (z>x) ) document.f1.c.value=z; } function accept() { x=window.prompt("enter the value"); y=window.prompt("enter the value"); z=window.prompt("enter the value"); } </SCRIPT> <BODY> <FORM NAME=f1> <CENTER>

<INPUT TYPE=BUTTON NAME=B1 VALUE=" Sum " onClick="fadd_click()">&nbsp&nbsp&nbsp <INPUT TYPE=BUTTON NAME=B4 VALUE=" Avg " onClick="fdiff_click()">&nbsp&nbsp&nbsp <INPUT TYPE=BUTTON NAME=B2 VALUE=" Product " onClick="fmult_click()">&nbsp&nbsp&nbsp <INPUT TYPE=BUTTON NAME=B3 VALUE="Smallest" onClick="fSmall()">&nbsp&nbsp&nbsp <INPUT TYPE=BUTTON NAME=B5 VALUE="Largest" onClick="fLarge()">&nbsp&nbsp&nbsp <INPUT TYPE = TEXT NAME="c">&nbsp&nbsp&nbsp </center> </FORM> </BODY> </HTML>

13)Write an application to decide a number as even/odd. Eveodd.html:


<HTML> <HEAD><CENTER> </center></HEAD> <SCRIPT LANGUAGE="JAVASCRIPT"> function fcheck() { r=window.prompt("enter the value"); if (eval(r)%2==0) window.alert("Given No. is Even"); else window.alert("Given No. is Odd"); } </SCRIPT> <BODY> <FORM NAME=f1> <CENTER> <INPUT TYPE=BUTTON NAME=B1 VALUE=" Odd Even " onClick="fcheck()">&nbsp&nbsp&nbsp </center> </FORM> </BODY> </HTML>

14)Write an application to convert a binary no. to decimal. Bintodec.html:


<HTML> <HEAD><CENTER> </center></HEAD> <SCRIPT LANGUAGE="JAVASCRIPT">

function fcheck() { a=window.prompt("enter the value"); s=0;c=0; while (a>0) { r=a%10; s=s+ r* Math.pow(2,c); c=c+1; a=Math.floor(a/10); } window.alert(s); } </SCRIPT> <BODY> <FORM NAME=f1> <CENTER> <INPUT TYPE=BUTTON NAME=B1 VALUE=" Binary To Decimal " onClick="fcheck()">&nbsp&nbsp&nbsp </center> </FORM> </BODY> </HTML>

15)Write an application to determine rt. Angled triangle or not. Rttriangle.html:


<HTML> <HEAD><CENTER> </center></HEAD> <SCRIPT LANGUAGE="JAVASCRIPT"> function fcheck() { a=window.prompt("enter the value"); b=window.prompt("enter the value"); c=window.prompt("enter the value"); if (a>0 && b>0 && c>0) validate(); else

window.alert("Numbers should be Greater than Zero"); } function validate() { if (a>b && a>c) {lar =a;f=b;s=c} else if (b>a && b>c) {lar =b;f=a;s=c} else {lar =c;f=a;s=b} if(Math.pow(lar,2)==Math.pow(f,2)+Math.pow(s,2)) window.alert (a +" " + b + " " + c + " Can be the Sides of a Right angled triangle") else window.alert (a + " " + b + " " + c + " Cannot be the Sides of a Right angled triangle") } </SCRIPT> <BODY> <FORM NAME=f1> <CENTER> <INPUT TYPE=BUTTON NAME=B1 VALUE=" Right Angle Triangle " onClick="fcheck()">&nbsp&nbsp&nbsp </center> </FORM> </BODY> </HTML>

16)Write an application to implement a prime number. Prime.html:


<HTML> <HEAD><CENTER> </center></HEAD> <SCRIPT LANGUAGE="JAVASCRIPT"> function fcheck() { a=window.prompt("enter the value"); p=0; for(i=2;i<=(a-1);++i) { if (a%i==0) { p=1; break; }

} if(p==0) document.write( "<font color=red size=50>" + a +" is Prime " ); else document.write( "<font color=red size=50>" + a +" is Not Prime " );

} </SCRIPT> <BODY> <FORM NAME=f1> <CENTER> <INPUT TYPE=BUTTON NAME=B1 VALUE=" Prime " onClick="fcheck()">&nbsp&nbsp&nbsp </center> </FORM> </BODY> </HTML>

17)Write an application to convert Celsius to Fahrenheit and viceversa. Ctof.html:


<html> <script language="JAVASCRIPT"> function CtoF() { C=window.prompt("enter the value"); F=9.0/5.0*C+32; window.alert (F); } function FtoC() { F=window.prompt("enter the value"); C=(5.0/9.0)*(F-32); window.alert (C); }

</script> <body bgcolor="wheat"> <form name="f1"> <input type=button value="C to F" onClick="CtoF()"><br>

<input type=button value="F to C" onClick="FtoC()"> </body> </html>

18)Write an application to perform switch case. Switch.html:


<body> <script type="text/javascript"> var n=0; n=prompt("Enter a number between 1 to 12:") switch(n) { case(n="1"): document.write("January"); break case(n="2"): document.write("Febuary"); break case(n="3"): document.write("March"); break case(n="4"): document.write("April"); break case(n="5"): document.write("May"); break case(n="6"): document.write("June"); break case(n="7"): document.write("July"); break case(n="8"): document.write("August"); break case(n="9"): document.write("September"); break case(n="10"): document.write("October"); break

case(n="11"): document.write("November"); break default: document.write("December"); break } </script> </body>

19)Write a java script program to add elements to List at run time. Addele.html:
<html> <head> <script type="text/javascript"> function addNew(name,val){ var opt = new Option(name, val); document.getElementById("myselect").add(opt,undefined); } </script> </head> <body> <select id="myselect"> <option value="1">Vineet</option> <option value="2">Sandeep</option> <option value="3">Vinod</option> <option value="4">Amar</option> </select> <button onClick="addNew('Kumar','5');this.disabled=true;"> Add </button> </body> </html>

20)Write an application to implement mathematical functions. Mathfun:


<HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT">

// Maths functions

function calc() { var inp = document.reals.inpt.value var func = document.reals.functn.value var outp = 0 if (func == 'round') {outp = Math.round (inp)} if (func == 'next') {outp = Math.ceil (inp)} if (func == 'last') {outp = Math.floor (inp)} if (func == 'pos') {outp = Math.abs (inp)} if (func == 'random') {outp = Math.random ()} document.reals.outpt.value = outp } </SCRIPT> </HEAD> <BODY> <FORM ACTION="#" NAME="reals"> <INPUT TYPE=TEXT NAME="inpt" SIZE=10 VALUE="2.4"> <SELECT NAME="functn" ONCHANGE="calc()"> <OPTION>- please select -</OPTION> <OPTION VALUE="round">rounded</OPTION> <OPTION VALUE="next">next integer</OPTION> <OPTION VALUE="last">previous integer</OPTION> <OPTION VALUE="pos">positive</OPTION> <OPTION VALUE="random">random</OPTION> </SELECT> <INPUT TYPE=TEXT NAME="outpt" SIZE=10 DISABLED> </FORM> </BODY>

</HTML>

21)Write an application to display current year, month, date. Date.html:


<HTML> <HEAD> </HEAD> <BODY> <FORM ACTION="#" NAME=date> <INPUT TYPE="radio" NAME="today" CHECKED ONCLICK="document.date.show.value=new Date().getFullYear()">Year <BR> <INPUT TYPE="radio" NAME="today" ONCLICK="document.date.show.value= (new Date().getMonth()) + 1">Month <BR>

<INPUT TYPE="radio" NAME="today" ONCLICK="document.date.show.value= new Date().getDate()">Day of month <BR><BR> <INPUT TYPE=TEXT NAME="show" SIZE=4 DISABLED> </SELECT> </FORM> <SCRIPT TYPE="TEXT/JAVASCRIPT"> document.date.show.value=new Date().getFullYear() </SCRIPT> </BODY> </HTML>

XML: 22)Write a simple well-formed xml document that contains emails contents

<?xml version="1.0" encoding="ISO-8859-1"?> <E-mail > <date> <day>12</day> <month>11</month> <year>99</year> </date> <To>Rohan</To> <From>Amit</From> <Subject>Surprise....</Subject> <Body>Be ready for a cruise...i will catch u tonight</Body> </E-mail>

.. 23)Wtrite a simple validate xml document against DTD


?xml version = "1.0" ?> <!DOCTYPE Employee SYSTEM "Employee.dtd"> <Employee> <Emp_Id> E-001 </Emp_Id> <Emp_Name> Vinod </Emp_Name> <Emp_E-mail> [email protected] </Emp_E-mail> </Employee> <!ELEMENT Employee (Emp_Id, Emp_Name, Emp_E-mail)> <!ELEMENT Emp_Id (#PCDATA)>

<!ELEMENT Emp_Name (#PCDATA)> <!ELEMENT Emp_E-mail (#PCDATA)>

24)Wtrite a simple validate xml document against Sche

<?xml version="1.0"?> <E-mail> <To>Rohan</To> <From>Amit</From> <Subject>Surprise....</Subject> <Body>Be ready for a cruise...</Body> </E-mail> <?xml version="1.0"?> <xs:schema xmlns:xs=http://www.w3.org/2001/XMLSchema> <xs:element name="E-mail"> <xs:complexType> <xs:sequence> <xs:element name="To" type="xs:string"/> <xs:element name="From" type="xs:string"/> <xs:element name="Subject" type="xs:string"/> <xs:element name="Body" type="xs:string"/> </xs:sequence> </xs:complexType> </xs:element> </xs:schema>

You might also like