Sie sind auf Seite 1von 41

PRACTICAL FILE OF HTML, XML &JSP

Submitted to: Miss Ritu Garg (Assist. Prof. of MCA)

Submitted by: Rohan Goyal Roll No:-

INDEX
Sno. Program Name 1. Script to Implement List. Date Signature

2.

Script to Implement Full Formatted Page in HTML. Script to use the Image Maps in HTML.

3.

4.

Script to Implement Full Table Layout in HTML. Script to Implement Frame Layout in HTML. Script to Implement IFrame in HTML.

5.

6.

7.

Script to Implement embedded CSS in HTML. Script to Implement Linked CSS in HTML. Script to Implement Positioning and ZIndex Using CSS2. Script to Implement HTML Form.

8.

9.

10.

11.

Script to Implement XML file with CSS.

12.

Script to Implement XML Table Binding using Paging. Script to Implement Variable Number of Records using Single Template. Script to Implement Filter and Sorting.

13.

14.

15.

Script to Implement Include Request.

16.

Script to Implement Forward Request.

17.

Script to Implement Switch Case in JSP

18.

Script to Implement While and Do While in JSP. Script to Implement Query String.

19.

20.

Script to Implement Cookies.

Assignment:-1 /*Script to Implement List */


<html> <head> </head> <body> Reasons I like Html <ul> <li> I can make my pages as I want them</li> <li> Once I learn html, the other languages come easily <ul type="square"> <li>First Method </li> <li>Second Method </li> <li>Third Method </li> </ul> </li> <li> Even if I use an html editor, I can now adjust aspects of the page</li> <li> I can look at other peoples html code to learn how to do neat things</li> </ul> <ol> <li> Html base code</li> <li>How to align text <ol type="A"> <li>First Method <ol type="a"> <li> ONE </li> <li> TWO </li> <li> THREE </li> <li> FOUR </li> <li> FOUR </li> </ol> </li> <li>Second Method </li> <li>Third Method </li>

</ol> </li> <li>Font attributes</li> <li>Inserting images</li> <li>Image attributes</li> <li> Creating links</li> <li> Sound attributes</li> <li>Making lists</li> </ol> </body> </html>

Output :

Assignment:-2 /* Script to Implement Full Formatted Page in HTML */ Output :

Assignment:-3 /* Script to use the Image Maps in HTML */


<html> <head> </head> <body> <img src="img1.jpg" style="height:50%;width:70%;" usemap="#imap"> <map name="imap" id="imap"> <area shape="circle" title="circle" coords="100,50,50" href="prog1.html"> <area shape="Rect" title="Rect" coords="200,250,150,40" href="prog2.html"> <area shape="Poly" title="Poly" coords="400,50,50,40,35,67,89,300,200,150,50,38,260,178,345,456" href="prog4.html"> </body> </html>

Output :

Assignment:-4 /* Script to Implement Full Table Layout in HTML */


<html> <head> <title>web-page using TABLE</title> </head> <body> <table height="680px" width="1340px" border="2"> <tr bgcolor="orange"> <td height="150px" colspan="3" > <font size="15"><b><span style="color:purple"><center>B</span><span style="color:yellow">O</span><span style="color:blue">O</span><span style="color:red">K</span><span style="color:teal">'s</span> Collection</center></span></b></font> <h2 style="color:purple"><marquee direction="left" >let's go!!!!! get lost in <span style="color:red">b</span><span style="color:yellow">O</span><span style="color:blue">o</span><span style="color:red">K</span><span style="color:teal">SSssssss</span>.....</marquee></h2> </td> </tr> <tr > <td height="50px" colspan="3"> <h3>

<center> <a href="#" style="color:orange" >HOME</a> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="#" style="color:orange">Variety of BOOKS</a> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="#"style="color:orange"> Stationery </a> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="#"style="color:orange"> Order </a> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="#"style="color:orange">Contact Us </a> </center> </h3> </td> </tr> <tr> <td width="200"> <img src="img/1.jpg" height="150px" width="200px"></br> <img src="img/8.jpg" height="120px" width="200px"></br> <img src="img/3.jpg" height="150px" width="200px"></br> </td> <td> <p font size="20"><blink><span style="color:red">Heyy....GoOd news for Book Lover's. </span></blink></p> </td > <td width="200px" height="200px">

<img src="img/14.jpg" height="250px" width="200px"></br> <marquee behavior="alternate"><img src="img/12.jpg" height="200px" width="170px"/></marquee> </td> </tr> </table> </body> </html>

Output :

Assignment:-5 /* Script to Implement Frame Layout in HTML */


<html> <head> <title> </title> </head> <frameset rows=" 10%,*" border= "2px solid"> <frame src="head.html" name="f1" id="f1" style="backgroundimage:url(new3.jpeg) "> </frame> <frameset cols="15%,*"> <frame src="link.html" name="f2" id="f2"> </frame> <frame name="f3" id="f3" style="background-color: #00ffff"> </frame> </frameset> </frameset> </html>

Output :

Assignment:-6 /* Script to Implement IFrame in HTML */


<html> <head> </head> <body> <h1 align="center"> Inline Frame </h1> <iframe src="index.html" name="iframe1" id="iframe1" width="100%" height="70%" align="left"> The quick brown fox jumps over the little lazy dog. </iframe> <p><b> This is a simple example of inline frame which is used iframes. One of the biggest problems with frames is that they initially were used simply because they existed. </b></p> </body> </html>

Output :

Assignment:-7 /* Script to Implement embedded CSS in HTML */


<html> <head> <style type="text/css"> #header {height: 10%; width: 100%; background-color:blue; border: 2px solid black;color: white;} h1 {margin-top: 1%;} #left { height: 50%; width: 20%;background-color: #8081E8; margintop: 4%;} ul {list-style: none;float: left;margin-left:50%; margin-top: auto;} li {float: left;margin: 10px;font-size: 22px;color: black;border-radius: 5px;} </style> </head> <body> <div id="header"> <center> <h1> INSTITUTE OF SMART STUDIES

</h1> </center> </div> <div> <ul> <a href="#"><li><u> Home </u></li></a> <a href="#"><li><u> Admition Form </u></li></a> <a href="#"> <li> <u>Faculty </u></li></a> <a href="#"> <li><u> About Us </u></li></a> </ul> </div> </html>

Output :

Assignment:-8 /* Script to Implement Linked CSS in HTML */


<html> <head> <link rel="stylesheet" href="css/link1.css" type="text/css"/> </head> <body> <div id="outer1"> Hello Sir <span id="inner"> this is inner part</span> </div> <div id="outer2"> way to the far right at the top</div> <div class="outer3"> Using the bottom and right properties </div> </body> </html>

Output :

Assignment:-9 /* Script to Implement Positioning and Z-Index Using CSS2*/


<html> <head> <style type="text/css"> #outer1 {position: absolute; left: 20px; top: 20px; height: 100px; zindex:3; width: 200px; background-color:yellow; color: green;} #inner {position: absolute; left: 30px; top: 30px; height: 50px;zindex:2; width: 100px; background-color:blue; color: white;} #outer2 {position: absolute; left: 40px; top: 40px; height: 100px; width: 300px;z-index:1; background-color:red; color: white;} #outer3 {position: absolute; left: 50px; top: 50px; right: 150px; height: 50px; z-index:4; width: 70px; background-color:purple; color:white;} </style> </head> <body> <div id="outer1"> Hello Sir <span id="inner"> this is inner part</span>

</div> <div id="outer2"> way to the far right at the top</div> <div id="outer3"> Using the bottom and right properties </div> </body> </html>

Output:

Assignment:-10 /* Script to Implement HTML Form */


<html> <head> </head> <body> <!-- Form For addmission in College --> <fieldset style="width: 45%; height:103%; border-color: red; "> <legend><h1> Admission Form</h1> </legend> <form> <table> <tr> <td> <label><b>Applicant Name</b></label></td> <td><input type="text" name="fname" placeholder="First Name"></td> <td><input type="text" name="mname" placeholder="Middle Name"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td> <td><input type="text" name="lname" placeholder="Last Name"></td> </tr> <tr> <td ><label><b>Father's Name</b></td> <td><input type="text" name="FatherName" placeholder="First Name"></td> <td><input type="text" name="mname" placeholder="Middle Name"></td> <td><input type="text" name="lname" placeholder="Last Name"></td> </tr> <td ><label><b>Mother's Name</b></td> <td><input type="text" name="MotherName" placeholder="First Name"></td>

<td ><input type="text" name="mname" placeholder="Middle Name"></td> <td ><input type="text" name="lname" placeholder="Last Name"></td> </tr> <tr> <td><label><b>Gender</b></label></td> <td><input type="radio" name="gender" value="Male">Male <input type="radio" name="gender" value="Female">Female</td> </tr> <tr> <td ><label><b> Date Of Birth </b></label></td> <td ><input type="text" name="dob" placeholder="dd/mm/yyyy"/></td> </tr> <tr> <td > <label><b> Course Name </b></label></td> <td ><select name="course"> <option value=" ------Select Course------"> ------Select Course------- </option> <option value="Maths1">MCA</option> <option value="Maths2">MBA</option> <option value="Maths3">MCA Laterl Entry</option> <option value="Maths3">BCA</option> <option value="Maths3">BBA</option> </select> </td> </tr> <tr> <td ><label><b> Previous Course </b></label></td> <td ><input type="text" name="pcname" placeholder="Course Name"/></td>

</tr> <tr> <td ><label><b> Phone Number </b></label></td> <td ><input type="text" name="pnumber"/></td> </tr> <tr> <td><label><b> Address</b> </label> </td> <td ><textarea name="address"></textarea></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> <fieldset style="height: 21%; width:90%; border-color: blue;"> <legend style="color: red;"> Marksheet </legend> <table border="2" style="border-color: green; width: 90%;"> <tr> <td><b> </b></td> <td><b> Marks Obtained </b> </td> <td><b> Total Marks</b> </td> <td><b> Percentage </b></td> </tr> <tr> <td><b>10th</b></td> <td><b></b></td> <td><b></b></td> <td><b></b></td> </tr> <tr> <td><b>10+2</b></td>

<td><b></b></td> <td><b></b></td> <td><b></b></td> </tr> <tr> <td><b>BCA</b></td> <td><b></b></td> <td><b></b></td> <td><b></b></td> </tr> </table> </fieldset> <input type="reset" name="reset" value="Reset"> <input type="submit" name="submit" value="Submit"> <input type="button" name="cancel" value="cancel"> </form> </fieldset> </body> </html>

Output :

Assignment:-11 /* Script to Implement XML file with CSS */ Output Assignment:-12 /* Script to Implement XML Table Binding using Paging */
<html> <head> <title>student record</title> </head> <body> <xml id="dsocollage" src="collage.xml"></xml> <h2>STUDENT RECORD<h2> <button onclick="collagetable.firstPage()"> |&lt; First Page </button>&nbsp;&nbsp; <button onclick="collageTable.previousPage()"> &lt; Previous Page </button>&nbsp;&nbsp; <button onclick="collageTable.nextPage()"> Next Page &gt; </button>&nbsp;&nbsp; <button onclick="collageTable.lastPage()"> Last Page &gt;| </button>&nbsp;&nbsp; <table id="collageTable" datasrc="#dsocollage" datapagesize="3" border="1" cellpadding="5">

<thead> <th>Name</th> <th>Roll no.</th> <th>Class</th> <th>Sem.</th> </thead> <tr align="center"> <td><span datafld="name"></span></td> <td><span datafld="rollno."></span></td> <td><span datafld="class"></span></td> <td><span datafld="sem"></span></td> </tr> </table> </body> </html>

Output :

Assignment:-13 /* Script to Implement Variable Number of Records using Single Template */


XML File:<?xml version="1.0"?> <?xml-stylesheet type="text/xsl" href="eleventh.xsl"?> <Record> <student> <college>SSJITM</college> <sname> <FIRSTNAME>HEMANT</FIRSTNAME> <LASTNAME>JINDAL</LASTNAME> </sname> <class>MCA</class> <rollno>280</rollno> </student> <student> <college>SSJITM</college> <sname> <FIRSTNAME>ROHAN</FIRSTNAME> <LASTNAME>GOYAL</LASTNAME> </sname> <class>MCA</class> <rollno>298</rollno> </student> <student> <college>SSJITM</college> <sname> <FIRSTNAME>RAMANPREET</FIRSTNAME> <LASTNAME>KAUR</LASTNAME> </sname> <class>MCA</class> <rollno>285</rollno> </student>

<student> <college>SSJITM</college> <sname> <FIRSTNAME>ROHIT</FIRSTNAME> <LASTNAME>JINDAL</LASTNAME> </sname> <class>MCA</class> <rollno>265</rollno> </student> </Record>

XSL File:<?xml version="1.0"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl"> <xsl:template match="/"> <H2> Student Record</H2> <xsl:for-each select="Record/student"><BR/> <span style="font-style:italic"> S_Name: </span> <xsl:value-of select="sname"/><BR/> <span style="font-style:italic"> College: </span> <xsl:value-of select="college"/><BR/> <span style="font-style:italic"> Class: </span> <xsl:value-of select="class"/><BR/> <span style="font-style:italic"> Roll No.: </span> <xsl:value-of select="rollno"/><BR/> </xsl:for-each> </xsl:template> </xsl:stylesheet>

Output :

Assignment:-14 /* Script to Implement Filter and Sorting */


XML File:<?xml version="1.0"?> <?xml-stylesheet type="text/xsl" href="fourteenth.xsl"?> <Record> <student present="yes"> <college>SSJITM</college> <sname dob="1990"> <FIRSTNAME>HEMANT</FIRSTNAME> <LASTNAME>JINDAL</LASTNAME> </sname> <class>MCA</class> <rollno>280</rollno> </student> <student present="yes"> <college>SSJITM</college> <sname dob="1988"> <FIRSTNAME>ROHAN</FIRSTNAME> <LASTNAME>GOYAL</LASTNAME> </sname> <class>MCA</class> <rollno>298</rollno> </student> <student present="yes"> <college>SSJITM</college> <sname dob="1991"> <FIRSTNAME>RAMANPREET</FIRSTNAME> <LASTNAME>KAUR</LASTNAME> </sname> <class>MCA</class> <rollno>285</rollno> </student>

<student present="no"> <college>SSJITM</college> <sname dob="1992"> <FIRSTNAME>ROHIT</FIRSTNAME> <LASTNAME>JINDAL</LASTNAME> </sname> <class>MCA</class> <rollno>265</rollno> </student> </Record>

XSL File:<?xml version="1.0"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl"> <xsl:template match="/"> <H2> Students in College </H2> <table border="1" cellpadding="5"> <thead> <th> College</th> <th> rollno</th> <th> S_Name</th> <th> Class</th> </thead> <xsl:for-each select="Record/student[@present='yes']"> <tr align="center"> <td> <xsl:value-of select="college"/><BR/> </td> <td> <xsl:value-of select="rollno"/> </td> <td>

<xsl:value-of select="sname"/><BR/> (dob <xsl:value-of select="sname/@dob"/>) </td> <td> <xsl:value-of select="class"/> </td> </tr> </xsl:for-each> </table> </xsl:template> </xsl:stylesheet>

Output :

Assignment:-15 /* Script to Implement Include Request */ Output : Assignment:-16 /* Script to Implement Forward Request */ Output: Assignment:-17 /* Script to Implement Switch Case in JSP */ Output : Assignment:-18 /* Script to Implement While and Do While in JSP */ Output: Assignment:-19 /* Script to Implement Query String */ Output: Assignment:-20 /* Script to Implement Cookies */ Output:

Das könnte Ihnen auch gefallen