You are on page 1of 14

LABMANUAL

SUBJECT:WEBTECHNOLOGY

CLASS:T.E(COMPUTER)

SEMESTER:VI

INDEX
No.

Title

Pag
e
No.

ImplementsBasicHTMLTags

ImplementationOfTableTag

ImplementationOfFRAMES

DesignAFORMInHTML(Yahooregistrationform)

ValidationOfFORMUsingJavaScript.

ImplementationOfCSS(All4Types)

DevelopAClockUsingJavaScript

DHTML(Layer/DIV)

10

ASPImplementResponseObject

11

10

ConnectivityToDatabaseThroughASP

12

11

PROJECTDevelopAECommerceWebSite

13

Practical1
Title:ImplementsBasicHTMLTags.
Aim:Createahomepagewhichhasanimageandalistto
navigatetootherpagesofthesamesite.
References:KrissJamsa
Requirements:Writeaprogramwhichwillperformthefollowingtasks:
1. Useof<HTML><HEAD><TITLE><BODY>Tags
2. Useof<H1>to<H6>Tags
3. Useof<img>Tag
4. Useof<br>,<hr>,<p>Tags
5. UseofAllTextFormattingTagslike
<b>,<i>,<u>,<em>,<big>,<small>,<sub>,<sup>,
<address>,<del>,<ins>
6. UseOfHyperlinki.e.<a></a>Tag.

Practical2
Title:ImplementationOfTableTag
Aim:TodisplayUniversityMarksheetUsingTablesTag
References:KrissJamsa
Requirements:Tablesaredefinedwiththe<table>tag.Atableisdividedinto
rows(withthe
<tr>tag),andeachrowisdividedintodatacells(with
the<td>tag).The
letterstdstandsfor"tabledata,"whichisthecontent
ofadatacell.Adatacell
cancontaintext,images,lists,paragraphs,forms,
horizontalrules,tables,etc.
Tagsrequiredareasfollows:
1) <table>..</table>
Definesatable
Attributeoftable
BorderIfyoudonotspecifyaborderattribute

thetablewillbedisplayedwithout
anyborders
<tableborder="1">
CellPaddingtocreatemorewhitespace
betweenthecellcontentandits
borders.
<tableborder="1"
cellpadding="10">
CellSpacingtoincreasethedistancebetween
thecells.
<tableborder="1"
cellspacing="10">
2) <th>..</th>

Displaysheadinginthetable

3) <tr>..</tr>

Dividestableintorows

4) <td>..</td>

Divideintodatacells

5)<caption>..</caption>

Itgivestitleforatable

Practical3
Title:ImplementationOfFRAMES
Aim:Createahomepagewhichwillhavevariousframesfor
theusertonavigatetodifferentsectionsofasite.
References:KrissJamsa
Requirements:
:Withframes,youcandisplaymorethanoneHTMLdocumentinthesame
browserwindow.EachHTMLdocumentiscalledaframe,andeachframe
isindependentoftheothers.
Tagsrequiredareasfollows:
1)<frameset>..</frameset>

Defineshowtodividethewindowinto
frames
Attributesofframeset

colsTodivideaframevertically

<framesetcols="25%,75%">
rowsTodivideaframehorizontally
<framesetrows="25%,50%,25%">
Theframesetcolumnsizevaluecanalsobeset
inpixels(cols="200,500"),andoneofthe
columnscanbesettousetheremainingspace
(cols="25%,*").
2)<frame>

DefineswhatHTMLdocumenttoputintoeach
frame
Attributesofframe
srclocationoffile
namenameoftheframe

3)<noframes>..</noframes> Definesanoframesectionforbrowsersthat
cannotdisplayframes

Practical4
Title:DesignAFORMInHTML(Yahooregistrationform)
Aim:CreateaFormwhichhastextfields,textarea,checkbox,
radiobutton,submitbutton,resetbutton,dropdown
box,image(ifrequired)
References:KrissJamsa
Requirements:Aformisanareathatcancontainformelements.

Formelementsareelementsthatallowtheusertoenterinformatio
(liketextfields,textareafields,dropdownmenus,radiobuttons,checkboxes,etc.)ina
form.
Tagsrequiredareasfollows:
1)<form>..</form>

Aformisdefinedwiththistag.

Attributeofform:
actionWhentheuserclicksonthe"Submit"button,
thecontentoftheformissenttoanotherfile.
Theform'sactionattributedefinesthenameof
thefiletosendthecontentto.
<formname="input"
action="html_form_action.asp">
2)<input>
Themostusedformtagisthe<input>tag.Thetypeof
inputisspecifiedwiththetypeattribute.Themost
commonlyusedinputtypesareexplainedbelow.

Textfields<inputtype="text"name=fname>
RadioButtons<inputtype="radio"name="gender"value=male>
Checkboxes<inputtype="checkbox"name="vehicle"value="Bike">
SubmitButton<inputtype="submit"value="Submit">
ResetButton<inputtype="reset"value="Reset">
<textarea>..Usedtoacceptmultiplelinefromtheuser
</textarea>
<select>..Usedtocreateadropdownlist.
</select>

Practical5
Title:ValidationOfFORMUsingJavaScript.
Aim:TostudyconceptsofJavascript.
References:KrissJamsa
Requirements:Writeaprogramwhichwillperformthefollowingtasks:
Takethesameformfrompreviouspracticali.e.Yahoo
registrationform.
Nowvalidatethisformi.eyouhavetocheckbefore
submittingtheformwhether
1.anyfieldoftheformisempty?
2.emailaddressisavalidemailaddressornot,(firstletter
shouldbealwayscharacter,itshouldcontain@etc.)
3.passwordshouldnotbemorethan7characterslong.

Practical6
Title:ImplementationOfCSS(All4Types)
Aim:Tostudycascadingstylesheets(css).
References:KrissJamsa
Requirements:Writeaprogramwhichwillperformthefollowingtasks:
CSSisasetofspecificationscalledrulesthatgiveyou
completecontroloverlayoutofawebpageandthe
appearanceofthecontents.
Youhavetoimplement4waysofaddingCSStoawebpage
i.e.
1)EmbeddingCSS
2)LinkingtoanexternalCSS
3)ImportinganexternalCSS
4)InlineCSS

Practical7
Title:DevelopAClockUsingJavaScript
Aim:Todisplayadigitalclockatthestatusbarusingjavascript.
References:KrissJamsa
Requirements:AClockcanbedisplayedusingthehelpofDate()Object.
varmyDate=newDate();
MethodsofDateObject
1)getHours()Returnsthehourofadateobject(from0

23)
2) getMinutes()Returnstheminutesofadateobject
(from059)
3) getSeconds()ReturnsthesecondsofadateObject.(from
059)
WehavetousethemethodsetTimeout()&clearTimeout()
setTimeout()Itbelongstowindowobjects.Itisusedto
callafunctionorevaluateanexpressionafteraspecifiednumberof
milliseconds.
Syntax
setTimeout(code,millisecond,lang)
wherecodeApointertoafunctionotthecodetobeexecuted.
millisecondTheno.ofmillisecondstowaitbeforeexecutingthe
code,
langOptional,itisthescriptinglanguage.

clearTimeout()
Thisalsobelongstowindowobject.Itcancelsatimeoutthatissetwith
thesetTimeout()metho.

Practical8
Title:DHTML(Layer/DIV)
Aim:Toimplementdivandlayertag.
References:KrissJamsa
Requirements:Writeaprogramwhichwillperformthefollowingtasks:
1) TheDivtagdefinesdivision/sectioninaHTML
document.Browsergenerallyplacealinebreakbefore
andafter<div>element.
<div>tagisusedtogrouptogetherblockelementsto
formatthemwithstyles.
2)Layertagallowsustopositionblocksofcontentinthe
webpage.Thesecontentsmayoverlapeachotherbe
transparent,opaque,visibleoreveninvisible.

Practical9
Title:ASPImplementResponseObject
Aim:ToimplementtheresponseobjectofASP.
References:ASPWroxPublication
Requirements:Writeaprogramwhichwilldisplaysometextatthe
browser'swindow.
YouhavetowriteaASPprograminJavascript&VBScript
usingresponseobjectthatwilldisplaysometext.

Practical10
Title:ConnectivityToDatabaseThroughASP
Aim:Tocreateadatabaseconnectionanddisplaydata.
References:ASPWroxpublication
Requirements:1.FirstwehavetosettheODBCDriverthroughControl
Panel.
2.Thenselectthedatabasetowhichyouwanttoconnectto.
3.NowwriteacodeforASPtodisplaythedata,deletethe
particularrecord,addnewdatatodatabase.

Practical11
Title:DevelopAECommerceWebSite.
Aim:ToDevelopAECommerceWebSite.
References:KrissJamsa,Javascriptin21days,ASPWroxPublication
Requirements:YoushoulduseallHTML,DHTML,JavaScript,ASPto
developthiswebsite.
Thereshouldbeinteractionbetweenclientandserver.
Youshouldbeabletostoredata,retrieverecords,delete
data,searchdata,usingASP.
SynopsisForTheProject:
Title
Applications
LanguagesUsed
HardwareComponents
SoftwareComponents
SystemDiagram
Description
WholeCodePrintout
FirstPageOutput