HTML, XML & JavaScript Lab Program

HTML, XML AND JAVASCRIPT LAB
PROGRAM OBJECTIVE AND OUTCOME

PROGRAM : B.Sc. Information Technology
OBJECTIVE
1. Apply the knowledge of Technology, Mathematics, Networks and computing in the

core information technologies.
2. Identify, design, and analyze complex computer systems and implement and interpret
the results from those systems
3. Analyze the local and global impact of computing on individuals, organizations, and
society.
4. One of the most important benefits of taking computer courses is that the students will
have more jobs available to them.
5. The types of new jobs that will be available depend on what kind of courses they take,
but every group of courses will open up new opportunities.
COURSE OBJECTIVE AND OUTCOME

COURSE OBJECTIVE
The course will enable students to
1. Understand the importance of the web as a medium of communication.

2. Understand the principles of creating an effective web page, including an in-depth
consideration of information architecture.
3. Develop skills in analyzing the usability of a web site.
4. Learn the language of the web: HTML and CSS.
5. Be able to embed social media content into web pages.
6. Implement and understand how to interpret basic web analytics.
COURSE OUTCOME
After studying this course, students will be able to:

1. Create web pages using HTML and Cascading Styles sheets.
2. Analyze a web page and identify its elements and attributes.
3. Use JavaScript and XHTML to create web pages with advanced interactivity. 4.
Program basic functions in JavaScript and XHTML.
4. Use JavaScript to create functional forms.
5. Use JavaScript to control browser frames and windows.
6. Use cascading style sheets to design web pages.
LIST OF PROGRAMS
1. Design Simple Web Pages using standard HTML tags like, HEAD, TITLE, and BODY
2. Design HTML web pages, which make use of INPUT, META, SCRIPT, FORM,
APPLET, BGSOUND, MAP
3. Working with various attributes of standard HTML elements
4. Using JavaScript's Window and document objects and their properties and various
methods like alert(), eval(), Parselnt () etc. methods to give the dynamic functionality to
HTML web pages
5. Writing JavaScript snippet which makes use of JavaScript's in-built as well as user
defined objects like navigator, Date Array, Event, Number etc.
6. Write code which does the form validation in various INPUT elements like Text Field,
Text Area, Password, Selection list etc.
7. Writing XML web Documents which make use of XML Declaration, Element
Declaration, Attribute Declaration
8. Usage of Internal DTD, External DTD, Entity Declaration.
PREREQUISITES
HARDWARE & SOFTWARE REQUIREMENTS
Hardware Requirements:
 Pentium Dual Core @ 2.70 Ghz and above with 2GB RAM
 160 GB HARD Disk
 Monitor 1024* 768 color
 Optical Mouse & Keyboard
 Software and Pre require knowledge
Software Requirements:
 Windows Operating System
 Notepad++ / Sublime Text 3 (Text Editors)
 HTML Validator
 Mozilla Firefox / Google Chrome (Browser)
MANUAL FOR PROGRAMS
PROGRAM 1
Design Simple Web Pages using standard HTML tags like, HEAD, TITLE, and BODY
1. AIM:
To Develop a Simple Web Page that displays details of any four of your friends using HEAD,
TITLE and BODY. Each of your friend’s names must appear as hot text. When you click your
friend’s name, it must open another html document, which tells about your friend.
2. TEST CASE
TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATU

ID DESCRIPTION OUTPUT OUTPUT S
TC_01 HTML Tag <Html> ----------------- Every html document contain It is used to Same as Success
</html> s opening and closing tag of represent your html E.O
html page in web
browser.
TC_02 HEAD Tag <Head>----------------- It can define title , style sheet , It is used to specify Same as Success
-</Head> script language for the html Title tag for the E.O
page page.
TC_03 Title Tag <Title> Title Text It specify the Title heading It accepts the title Same as Success
Name </Title> will appears at the browser’s text in the browsers E.O
title bar page
TC_04 Body Tag <Body> --------------- Body tag defines the actual It displays the html Same as Success
</Body> content to be presents in the document in the E.O
web page browser window
TC_05 Heading Tag <h1> Text Name It represents the text with bold It has higher Same as Success
</h1> ,size and face style priority for E.O
displaying the text
TC_06 Back ground <body bgcolor = It represents the background It displays the Same as Success
color “red”> color of the web page background in red E.O
included in <body> tag color
TC_07 Font color <font color = It defines the color of the text It displays the text Same as Success
“yellow”> in varying color in yellow color E.O
TC_08 Line Breaking <br> It breaks the current line and It allows the text to Same as Success
moves the cursor to the new enter in new line E.O
line
TC_09 Namespace It gives the space between the It makes the gap Same as Success
text between the text E.O
TC_10 Hyperlink <a href = It links the other html We can set the Same as Success
“targetfilename.html> document. hyperlinks to the E.O
Textname </a> text.
3. SOURCE CODE:
3.1. MAIN PAGE
<HTML>
<HEAD>
<TITLE> FRIENDS NAME </TITLE>

</HEAD>
<BODY BGCOLOR = #0FFF0F >
<FONT COLOR = BLACK > <H1 ALIGN = CENTER><U> FRIENDS NAME

</U></H1><BR></FONT>
<FONT COLOR = YELLOW SIZE="4">

<H1> <STRONG> <A HREF = "KRS.HTML"> 1.ANITHA </A><BR>
<A HREF = "TSP.HTML"> 2.VEENA </A><BR>
</STRONG>
</H1>
</FONT>
</BODY>
</HTML>
3.2. KRS.HTML Page
<HTML>
<HEAD>
<TITLE>ANITHA </TITLE>
</HEAD>
<BODY BGCOLOR = YELLOW>
<FONT COLOR = GREEN> <H1 ALIGN = CENTER><U> ANITHA </U>

</H1><BR></FONT>
<FONT COLOR=RED SIZE =5>

    He is so honest and sincere in his work.Now he is lecturer
in Technical Department
<BR><BR><BR><BR><BR><BR><BR><BR><BR>
<A HREF = "FRIENDS.HTML"><B> MAIN PAGE </B></A>
</FONT>
</BODY>
</HTML>
3.3. TSP.HTML Page
<HTML>
<HEAD>
<TITLE> VEENA </TITLE>
</HEAD>
<BODY BGCOLOR = YELLOW>
<FONT COLOR = GREEN> <H1 ALIGN = CENTER><U> VEENA </U>

</H1><BR></FONT>
<FONT COLOR=RED SIZE =5>

        He is a polite and humble
persons,he is a technical staff in KGCAS and technical instructioner to B.Sc CT &IT
<BR><BR><BR><BR><BR><BR><BR><BR><BR>
<A HREF = "FRIENDS.HTML"><B> MAIN PAGE </B></A>
</FONT>
</BODY>
</HTML>
4. OUTPUT:
4.1. FRIENDS.HTML PAGE

4.2. KRS.HTML PAGE
4.3. TSP.HTML PAGE

5. CONCLUSION
Thus we developed a HTML document which displays Friends name and their details using
HEAD, TITLE and BODY tags.
---------------------------------------------------------------------------------------------------------------------
PROGRAM 2
Design HTML web pages, which make use of INPUT, META, SCRIPT, FORM, APPLET,
BGSOUND, MAP
1. AIM:
To Develop a Simple Web Page that includes INPUT, META, SCRIPT, FORM, APPLET,
BGSOUND and MAP.
2. TEST CASE
TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATUS

ID DESCRIPTION OUTPUT OUTPUT
html page in web
browser.
page page.
TC_03 Title Tag <Title> Title Text It specify the Title heading It accepts the title Same as Success
Name </Title> will appears at the browser’s text in the browsers E.O
title bar page
TC_05 Heading Tag <h1> Text Name It represents the text with bold It has higher Same as Success
</h1> ,size and face style priority for E.O
displaying the text
TC_06 Back ground <body bgcolor = It represents the background It displays the Same as Success
color “red”> color of the web page background in red E.O
included in <body> tag color
TC_07 Applet Tag <applet code = It was used to embed the Java It displays the text Same as Success
“mal.class”> applet in an HTML document. given in applet E.O
TC_08 Input Tag <input type="submit" The <input> tag specifies an It allows an input Same as Success
value="Submit"> input field where the user can field E.O
enter data.
TC_09 META tag <meta charset="UTF- The <meta> tag provides Metadata will not Same as Success
8"> metadata about the HTML be displayed on the E.O
document page, but will be
machine parsable.
TC_10 SCRIPT tag <script> The <script> tag is used to We can set the Same as Success
------</script> define a client-side script hyper links to the E.O
text.
TC_11 BGSOUND tag <bgsound>…</ <bgsound> tag is used to We can embed the Same as Success
bgsound> embed sound files into a web sound files E.O
page
TC_12 MAP tag <MAP>…</MAP> The <map> tag is used to An image-map is Same as Success
define a client-side image- an image with E.O
map clickable areas.
3. SOURCE CODE:
<HTML>
<HEAD>
<TITLE>HTML BGSOUND TAG</TITLE>
<META NAME="DESCRIPTION" CONTENT="LAB PROGRAM - 2" />
<META NAME="KEYWORD"
CONTENT="2,HTML,MAP,APPLET,BGSOUND,META,INPUT,FORM,SCRIP
T" />
<META NAME="AUTHOR" CONTENT="VIGHNESHBALAJI" />
</HEAD>
<BODY>
<FORM NAME="ARTH">
<INPUT TYPE="TEXT" NAME="NUM1" ID="NUM1" SIZE="5" />
<INPUT TYPE="TEXT" NAME="NUM2" ID="NUM2" SIZE="5" />
<INPUT TYPE="TEXT" NAME="ANS" ID="ANS" SIZE="5" />
<INPUT TYPE="BUTTON" VALUE="ADD" ONCLICK="ADD();" />
</FORM>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
FUNCTION ADD()
{
DOCUMENT.ARTH.ANS.VALUE =
PARSEINT(DOCUMENT.ARTH.NUM1.VALUE) +
PARSEINT(DOCUMENT.ARTH.NUM2.VALUE);
}
</SCRIPT>
<IMG SRC="C:\USERS\STUDENT\DESKTOP\WIND.JPG"
NAME="BDYIMG" ID="BDYIMG" USEMAP="#BODY" />
<MAP NAME="BODY" ID="BODY">
<AREA SHAPE="RECT" COORDS="130,75,160,90" HREF="C:\USERS\
STUDENT\DESKTOP\WIND.JPG"
ALT="EYE">
<AREA SHAPE="RECT" COORDS="175,75,200,85" HREF="C:\USERS\
STUDENT\DESKTOP\WIND.JPG"
ALT="EYE">
</MAP>
<BGSOUND SRC = "C:\USERS\FACULTY\DESKTOP\KALIMBA.MP3">
</BODY></HTML>
4. OUTPUT
5. CONCLUSION
Thus we developed a HTML document which displays Friends name and their details using
INPUT, META, SCRIPT, FORM, APPLET, BGSOUND and MAP tags.
------------------------------------------------------------------------------------------------------------------------
PROGRAM 3
Working with various attributes of standard HTML elements

1. AIM:
To Develop a Simple Web Page that displays all standard HTML Elements
2. TEST CASE

TC_01 HTML Tag <Html> Every html document It is used to Same as Success
-----------------</html> contain s opening and represent your html E.O
closing tag of html page in web
browser.
TC_02 HEAD Tag <Head>------------------</ It can define title , style It is used to specify Same as Success
Head> sheet , script language Title tag for the E.O
for the html page page.
TC_03 Title Tag <Title> Title Text Name It specify the Title It accepts the title Same as Success
</Title> heading will appears at text in the browsers E.O
the browser’s title bar page
TC_04 Body Tag <Body> Body tag defines the It displays the html Same as Success
---------------</Body> actual content to be document in the E.O
presents in the web page browser window
TC_05 Heading Tag <h1> Text Name </h1> It represents the text It has higher Same as Success
with bold ,size and face priority for E.O
style displaying the text
TC_06 Back ground <body bgcolor = “red”> It represents the It displays the Same as Success
color background color of the background in red E.O
web page included in color
<body> tag
TC_07 Font color <font color = “yellow”> It defines the color of It displays the text Same as Success
the text in varying color in yellow color E.O
TC_08 Line Breaking <br> It breaks the current line It allows the text to Same as Success
and moves the cursor to enter in new line E.O
the new line
TC_09 Namespace It gives the space It makes the gap Same as Success
between the text between the text E.O
Textname </a> text.
3. SOURCE CODE:
<HTML>
<HEAD>
<CENTER><H2>CREATE AN E-MAIL ID<H2><LI></CENTER></LI>
<TITLE>KGCAS</TITLE></HEAD>
<BODY TEXT="VOILET"BGCOLOR="BROWN"><BR>
<PRE><U>1.PERSONAL DETAILS:</U><BR><BR>
<FORM>
NAME:<INPUT TYPE="TEXT"NAME=USER NAME"><BR>
DATE OF BIRTH:<INPUT TYPE:"TEXT" NAME="DOB"><BR><BR>
GENDER=<INPUT
TYPE="RADIO"NAME="SEX"VALUE="MALE">MALE<INPUT
TYPE="RADIO"NAME="SEX"VALUE="FEMALE">FEMALE<BR> LIVEIN:<SELECT
NAME="LINE IN>
<OPTION VALUE="INDIAN">INDIA
<OPTION VALUE="AMERICAN">AMERICA
<OPTION VALUE="AFRICAN">AFRICA
</SELECT><BR>
POSTAL CODE:<INPUT TYPE="TEXT"NAME="POST"<BR><BR>
<U>2.SELECT YOUR MAIL-ID AND PASSWORD:</U><BR><BR>
MAIL-ID:<INPUT TYPE="TEXT" NAME="PSWD">(MINIMUM 8 LETTER)<BR>
PASSWORD:<INPUT TYPE="PASSWORD"NAME="PSWD"><BR><BR>
<U>3.INCASE YOU FORGET YOUR PASSWORD:</U><BR><BR>
ALTERNATIVE PASSWORD:<INPUT TYPE="PASSWORD NAME"

NAME="PSWD"> (MINIMUM 8 LETTER)<BR> SECURITY QUESTION L:<ELECT
NAME="QUESTION">
<OPTION VALUE="WHICH PLACE DID YOU LIKE TO MOVE?">WHICH PLACE

DID YOU LIKE TO MOVE? ANSWER:<INPUT TYPE="TEXT"NAME="ANS">
<OPTION VALUE="WHICH IS YOUR FAVORITE FOOD?">WHICH IS YOUR

FAVORITE FOOD? ANSWER:<INPUT TYPE="TEXT"NAME="ANS">
</SELECT> <BR>
<INPUT TYPE="SUBMIT" VALUE="CREATE AN ACCOUNT">
<INPUT TYPE="RESET"><BR><BR>
</FORM>
</BODY>
</HTML>
4. OUTPUT
5. CONCLUSION
Thus we developed a HTML document using standard HTML Tags.

-------------------------------------------------------------------------------------------------------------------------------
PROGRAM 4
Using JavaScript's Window and document objects and their properties and various methods like
alert(), eval(), Parselnt () etc. methods to give the dynamic functionality to HTML web pages
1. AIM:
To Develop a Simple Web Page Using JavaScript's Window and document objects and their
properties and various methods like alert(), eval(), Parselnt () etc. methods to give the dynamic
functionality to HTML web pages
2. TEST CASE

TC_01 HTML Tag <Html> Every html document It is used to Same as Success
-----------------</html> contain s opening and represent your html E.O
closing tag of html page in web
browser.
TC_02 HEAD Tag <Head>------------------</ It can define title , style It is used to specify Same as Success
Head> sheet , script language Title tag for the E.O
for the html page page.
TC_03 Title Tag <Title> Title Text Name It specify the Title It accepts the title Same as Success
</Title> heading will appears at text in the browsers E.O
the browser’s title bar page
TC_04 Body Tag <Body> Body tag defines the It displays the html Same as Success
---------------</Body> actual content to be document in the E.O
presents in the web page browser window
TC_05 Heading Tag <h1> Text Name </h1> It represents the text It has higher Same as Success
with bold ,size and face priority for E.O
style displaying the text
TC_06 Back ground <body bgcolor = “red”> It represents the It displays the Same as Success
color background color of the background in red E.O
web page included in color
<body> tag
TC_07 Font color <font color = “yellow”> It defines the color of It displays the text Same as Success
the text in varying color in yellow color E.O
TC_08 Line Breaking <br> It breaks the current line It allows the text to Same as Success
and moves the cursor to enter in new line E.O
the new line
TC_09 Namespace It gives the space It makes the gap Same as Success
between the text between the text E.O
Textname </a> text.
3. SOURCE CODE:
<HTML>
<HEAD>
<TITLE>PRG3</TITLE>
</HEAD>
<BODY ONLOAD="ALERT('WELCOME TO MY WEBPAGE');">
<SCRIPT TYPE="TEXT/JAVASCRIPT">
FUNCTION ADD()
{
VAR A,B,C;
A = PARSEINT(DOCUMENT.ARTH.NUM1.VALUE);
B = PARSEINT(DOCUMENT.ARTH.NUM2.VALUE);
C = A + B;
DOCUMENT.ARTH.ANS.VALUE = EVAL(C);
}
</SCRIPT>
<FORM NAME="ARTH">
NUMBER 1 : <INPUT TYPE="TEXT" NAME="NUM1" ID="NUM1" />
NUMBER 2 : <INPUT TYPE="TEXT" NAME="NUM2" ID="NUM2" />
ADDITION : <INPUT TYPE="TEXT" NAME="ANS" ID="ANS" />
<INPUT TYPE="BUTTON" VALUE="ADD" ONCLICK="ADD();"/>
</FORM></BODY></HTML>
4. OUTPUT
5. CONCLUSION
Thus we developed a HTML document using JavaScript's Window and document objects
and their properties and various methods like alert(), eval(), Parselnt () etc. methods to give the
dynamic functionality to HTML web pages
.
PROGRAM 5
Writing JavaScript snippet which makes use of JavaScript's in-built as well as user defined
objects like navigator, Date Array, Event, Number etc.
1. AIM:
To Develop a Simple Web Page Using JavaScript's Window and document objects and their
properties and various methods like Date()Array(),etc. methods to give the dynamic functionality
to HTML web page.
2. TEST CASE

TC_01 HTML Tag <Html> Every html It is used to Same as Success

-----------------</html document contain represent your E.O
> s opening and html page in
closing tag of html web browser.
TC_02 HEAD Tag <Head>--------------- It can define title , It is used to Same as Success
---</Head> style sheet , script specify Title E.O
language for the tag for the
html page page.
TC_03 SCRIPT Tag <script>--------------- It accept the Same as Success
JavaScript code
---</script> include wherever html form E.O
it's needed, or input and
you can define returns the
functionality function in the
inside HTML browsers
document itself.
window.
TC_04 JavaScript Date() Date function It displays the Same as Success
function takes the today ‘s today’s date in E.O
date the browser
window
TC_05 JavaScript Array() It is used to store It displays Same as Success
function month using month E.O
array() function
TC_06 Form tag <form>------</form> It allows user to It accept user Same as Success
enter data in the name. E.O
form model.
TC_07 Form tag <input type=”text”> It allows user It displays the Same as Success
enter the name. text E.O
TC_08 Form tag <input It display the It allows to Same as Success
type=”button”> button. click the button E.O
TC_09 Alert Function Alert(‘ ---‘) It display the alertIt display Same as Success
message message to E.O
type username
in upperscase
TC_10 Input Tag onClick() It calls the sbt() We can see the Same as Success
javascript function today’s date E.O
with our name.
3. SOURCE CODE:
<html>
<head>
<script type="text/javascript">
function sbt()
{
var mydate=new Date();
var myMonth=Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct",
"Nov","Dec");
dsply.innerHTML="</br><B>"+document.prgfrm.uname.value+"</B>"+' today date
is'+mydate.getDate()+' - '+myMonth[mydate.getMonth()]
+"-"+mydate.getFullYear()+" and you use"+navigator.appName+"browser</b>";
}
</script>
</head>
<body>
<form name="prgfrm">
Enter name<input type="text" name="uname" id="uname" onclick="alert('Enter your Name
in Block letters');"/>
<input type="button" value="submit" onclick="sbt();"/>
</form>
<span name="dsply" id="dsply"></span>
</body>
</html>
4. OUTPUT:
4. CONCLUSION:
Thus we developed a Simple Web Page Using JavaScript's Window and document objects and
their properties and various methods like Date()Array(),etc.
PROGRAM 6
Write code which does the form validation in various INPUT elements like Text Field, Text
Area, Password, Selection list etc.
1. AIM:
To Develop a Simple Web Page that includes INPUT elements using Text Field, Text Area,
Password, Selection list etc.
2. TEST CASE

html page in web
browser.
page page.
TC_03 Title Tag <Title>Program It specify the Title heading It accepts the title Same as Success
6</Title> will appears at the browser’s text in the browsers E.O
title bar page
TC_05 Heading Tag <h2> Text Name It represents the text with bold It has second Same as Success
</h2> ,size and face style higher priority for E.O
displaying the text
TC_06 Form Tag <form It is used to include form for It displays the form Same as Success
name="application">- filling purpose. to set the text E.O
----</form> box,checkbox,radio
button and etc.
TC_07 Input Tag <input type="text"> The <input> tag specifies an It allows an input Same as Success
input field where the user can field E.O
enter data.
TC_08 Input Tag <input type="radio" > This tag specifies a radio It allows choose Same as Success
button where the user can any one of the E.O
choose any one option. option.
TC_09 Input Tag <input This tag specifies a check box It allows choose Same as Success
type="checkbox" > button where the user can any number of E.O
choose any number of option. option.
TC_10 Input Tag <input type="button" This tag specifies button It allows user click Same as Success
> where the user can click the the button to E.O
button. display the alert
message.
TC_11 Input Tag <input type="reset" > This tag specifies reset button It clears the Same as Success
where the user can choose this content. E.O
option to clear the previous
content.
3. SOURCE CODE:
<html>
<head>
<title> PROGRAM6</title>
</head>
<body bgcolor="#006060">
<h2> Application form </h2>
<form name="application">
Enter Name : <input type="text" size="20" name="stuname"/><br><br>
Enter Password : <input type="password" size="20" name="stupass"/><br/><br>
Enter Sex: <input type="radio" name="stusex" value="m"/> male
<input type="radio" name="stusex" value="f"/> female<br><br>
Enter Hobbies :
<input type="checkbox" name="stuho1" value="draw"/> Drawing
<input type="checkbox" size="20" name="stuho2" value="read"/> Reading
<input type="checkbox" size="20" name="stuho3" value="paint"/> Painting
<input type="checkbox" size="20" name="stuho4" value="sing"/>
Singing<br><br>
<input type="button" name="bt" onclick="alert(' processing
stop'+document.application.stuname.value);" value="stop"/><br/><br/>
<input type="submit" value="Send the form to server"> <br/><br/>
<input type="reset" value="Empty form">
</form>
</body>
</html>
4. OUTPUT
4. CONCLUSION:
Thus we developed aSimple Web Page that includes INPUT elements using Text Field, Text
Area, Password, Selection list etc.
---------------------------------------------------------------------------------------------------------------
PROGRAM 7
XML web Document
1. AIM:
To Develop a Simple XML web document using XML Declaration, Element Declaration, and
Attribute Declaration.
SYNTAX FOR XML DECLARATION
<?xml
version = "version_number"
encoding = "encoding_declaration"
standalone = "standalone_status"
?>
SYNTAX FOR ELEMENT DECLARATION
<element-name attribute1 attribute2>

....content
</element-name>
2. SOURCE CODE:
MVBPR7.xml
<?xml version="1.0" ?>
<?xml-stylesheet href="MVBPRG7.css" type="text/css" ?>
<name>
<myname>Vighneshbalaji</myname>
<regno>1526jb49</regno>
<dept>IT</dept>
<clg>KGCAS</clg>
</name>
MVBPRG7.css
myname
{ color:red; font-family:cursive; }
regno
{ color:green; font-family:cursive; }
dept
{ color:darkblue; font-family:cursive; }
clg
{ color:yellow; font-family:cursive; }
3.OUTPUT:
4.CONCLUSION:
Thus we developed a Simple XML web document using XML Declaration, Element Declaration,
and Attribute Declaration.
----------------------------------------------------------------------------------------------------------------
PROGRAM 8
Usage of Internal DTD, External DTD, Entity Declaration.
1. AIM
To develop a XML file that contains the internal and external DTD.
DTD
A DTD is a Document Type Definition.

A DTD defines the structure and the legal elements and attributes of an XML document.
An Internal DTD Declaration
If the DTD is declared inside the XML file, it must be wrapped inside the <!DOCTYPE>
definition:
 !DOCTYPE note defines that the root element of this document is note
 !ELEMENT note defines that the note element must contain four elements:
"to,from,heading,body"
 !ELEMENT to defines the to element to be of type "#PCDATA"
 !ELEMENT from defines the from element to be of type "#PCDATA"
 !ELEMENT heading defines the heading element to be of type "#PCDATA"
 !ELEMENT body defines the body element to be of type "#PCDATA"
An External DTD Declaration
If the DTD is declared in an external file, the <!DOCTYPE> definition must contain a reference
to the DTD file:
2.SOURCE CODE:
MVBPRG8INT.xml
<?xml version="1.0"?>
<!DOCTYPE note [
<!ELEMENT note (to,from,heading,body)>
<!ELEMENT to (#PCDATA)>
<!ELEMENT from (#PCDATA)>
<!ELEMENT heading (#PCDATA)>
<!ELEMENT body (#PCDATA)>
]>
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend</body>
</note>
MVBPRG8EXT.xml
<?xml version="1.0"?>
<!DOCTYPE note SYSTEM "note.dtd">
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>
note.dtd
<!ELEMENT note (to,from,heading,body)>

<!ELEMENT to (#PCDATA)>
<!ELEMENT from (#PCDATA)>
<!ELEMENT heading (#PCDATA)>
<!ELEMENT body (#PCDATA)>
3.OUTPUT:
4. CONCLUSION
Thus we developed a XML file that contains the internal and external Data Type Definition.

HTML, XML & JavaScript Lab Program

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

HTML, XML & JavaScript Lab Program

Uploaded by

Copyright:

Available Formats

HTML, XML AND JAVASCRIPT LAB

PROGRAM OBJECTIVE AND OUTCOME

1. Apply the knowledge of Technology, Mathematics, Networks and computing in the

COURSE OBJECTIVE AND OUTCOME

The course will enable students to

1. Understand the importance of the web as a medium of communication.

After studying this course, students will be able to:

TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATU

<TITLE> FRIENDS NAME </TITLE>

<FONT COLOR = BLACK > <H1 ALIGN = CENTER><U> FRIENDS NAME

<FONT COLOR = YELLOW SIZE="4">

3.2. KRS.HTML Page

<FONT COLOR = GREEN> <H1 ALIGN = CENTER><U> ANITHA </U>

<FONT COLOR=RED SIZE =5>

<FONT COLOR = GREEN> <H1 ALIGN = CENTER><U> VEENA </U>

<FONT COLOR=RED SIZE =5>

4.1. FRIENDS.HTML PAGE

4.3. TSP.HTML PAGE

TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATUS

Working with various attributes of standard HTML elements

TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATUS

<CENTER><H2>CREATE AN E-MAIL ID<H2><LI></CENTER></LI>

NAME:<INPUT TYPE="TEXT"NAME=USER NAME"><BR>

DATE OF BIRTH:<INPUT TYPE:"TEXT" NAME="DOB"><BR><BR>

POSTAL CODE:<INPUT TYPE="TEXT"NAME="POST"<BR><BR>

<U>2.SELECT YOUR MAIL-ID AND PASSWORD:</U><BR><BR>

MAIL-ID:<INPUT TYPE="TEXT" NAME="PSWD">(MINIMUM 8 LETTER)<BR>

<U>3.INCASE YOU FORGET YOUR PASSWORD:</U><BR><BR>

ALTERNATIVE PASSWORD:<INPUT TYPE="PASSWORD NAME"

<OPTION VALUE="WHICH PLACE DID YOU LIKE TO MOVE?">WHICH PLACE

<OPTION VALUE="WHICH IS YOUR FAVORITE FOOD?">WHICH IS YOUR

<INPUT TYPE="SUBMIT" VALUE="CREATE AN ACCOUNT">

Thus we developed a HTML document using standard HTML Tags.

TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATUS

TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATUS

TC_01 HTML Tag <Html> Every html It is used to Same as Success

TEST TEST TEST DATA TEST STEPS EXPECTED ACTUAL STATUS

XML web Document

SYNTAX FOR XML DECLARATION

SYNTAX FOR ELEMENT DECLARATION

<element-name attribute1 attribute2>

Usage of Internal DTD, External DTD, Entity Declaration.

A DTD is a Document Type Definition.

An Internal DTD Declaration

An External DTD Declaration

<!ELEMENT note (to,from,heading,body)>

You might also like