Sie sind auf Seite 1von 56

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS

Faculty of Engineering
Department of Computer Engineering & Information Technology

Solution of Assignment#1
Q1) Define the terms: a) Internet b) WWW c) Modem d) Router.
ANS:
a) Internet:-Internet refers to the electronic network of networks that connects individuals and
information by means of computers and other digital instruments permitting person-to-person
communication and information recovery. With this definition, one can infer that nowadays, the use
of internet is primarily for the exchange of information.
b) WWW:-The World Wide Web is a system of interlinked hypertext documents accessed via the
Internet. With a web browser, one can view web pages that may contain text, images, videos, and
other multimedia and navigate between them via hyperlinks.
c) Modem:-A modem (modulator-demodulator) is a device that modulates an analog carrier signal to
encode digital information, and also demodulates such a carrier signal to decode the transmitted
information. The goal is to produce a signal that can be transmitted easily and decoded to reproduce
the original digital data. Modems can be used over any means of transmitting analog signals, from
light emitting diodes to radio. The most familiar example is a voice band modem that turns the digital
data of a personal computer into modulated electrical signals in the voice frequency range of a
telephone channel. These signals can be transmitted over telephone lines and demodulated by
another modem at the receiver side to recover the digital data.
d) Router:- A router is a device that forwards data packets between computer networks, creating an
overlay internetwork. A router is connected to two or more data lines from different networks. When
a data packet comes in on one of the lines, the router reads the address information in the packet to
determine its ultimate destination. Then, using information in its routing table or routing policy, it
directs the packet to the next network on its journey. Routers perform the "traffic directing"
functions on the Internet.

Q2) Explain the seven layers of the OSI-ISO model.


ANS:-

Layer :-01 Physical Layer


The physical layer defines electrical and physical specifications for devices. In particular, it defines the
relationship between a device and a transmission medium. This includes the layout of pins, voltages,
cable specifications, hubs, repeaters, network adapters, host bus adapters and more.
The major functions and services performed by the physical layer are:
1.
2.
3.
4.
5.
6.

Representation of bits.
Data rate.
Synchronization of bits.
Line configuration.
Physical topology.
Transmission mode.

Layer:-02 Data Link Layer


The data link layer transforms the physical layer, a raw transmission facility, to a reliable
link. It makes the physical layer appear error-free to the upper layer (network layer).
Other responsibilities of the data link layer include the following:
1. Framing.
2. Physical addressing.
3. Flow control.

4. Error control.
5. Access control.
Layer:-03 Network Layer
The network layer is responsible for the source-to-destination delivery of a packet,
possibly across multiple networks (links). the network
layer ensures that each packet gets from its point of origin to its final destination.
Other responsibilities of the network layer include the following:
1. Logical addressing.
2. Routing.
Layer:-04 Transport Layer
The transport layer is responsible for process-to-process delivery of the entire message
The transport layer,
on the other hand, ensures that the whole message arrives intact and in order, overseeing
both error control and flow control at the source-to-destination level.
Other responsibilities of the transport layer include the following:
1.
2.
3.
4.
5.

Service-point addressing.
Segmentation and reassembly.
Connection control
Flow control.
Error control.

Layer:-05 Session Layer


The services provided by the first three layers (physical, data link, and network) are
not sufficient for some processes. The session layer is the network dialog controller.
It establishes, maintains, and synchronizes the interaction among communicating
systems.
Specific responsibilities of the session layer include the following:
1. Dialog control.
2. Synchronization.
Layer:-06 Presentation Layer
The presentation layer is concerned with the syntax and semantics of the information
exchanged between two systems.
Specific responsibilities of the presentation layer include the following:
1. Translation.
2. Encryption.
3. Compression.

Layer-07Application Layer
The application layer enables the user, whether human or software, to access the network.
It provides user interfaces and support for services such as electronic mail,
remote file access and transfer, shared database management, and other types of distributed
information services.
Specific services provided by the application layer include the following:
1.
2.
3.
4.

Network virtual terminal.


File transfer, access, and management.
Mail services.
Directory services.

Q3) Explain various protocols used in the network layer. Explain their use and ports they use.

ANS:- Various protocols used in the network layer are

IPv4/IPv6:- Internet Protocol


DVMRP:- Distance Vector Multicast Routing Protocol
ICMP,:-Internet Control Message Protocol
IGMP:- Internet Group Multicast Protocol
PIM-SM:-Protocol Independent Multicast Sparse Mode
PIM-DM:-Protocol Independent Multicast Dense Mode
IPsec:-Internet Protocol Security
IPX:-Internetwork Packet Exchange
RIP:-Routing Information ProtocolThe Routing Information Protocol (RIP) is a distance-vector
protocol that uses hop count as its metric. RIP is widely used for routing traffic in the global
Internet and is an interior gateway protocol (IGP), which means that it performs routing within a
single autonomous system.
DDP:-Datagram Delivery Protocol
BGP:-Border Gateway Protocol the Border Gateway Protocol (BGP) is the protocol backing the
core routing decisions on the Internet. It maintains a table of IP networks or 'prefixes' which
designate network reachability among autonomous systems (AS).
ARP:-Address Resolution Protocol(ARP) is a telecommunications protocol used for resolution of
network layer addresses into link layer addresses, a critical function in multiple-access networks.
RARP:-Reverse Address Resolution Protocol

Q4) Explain the role of HTTP protocol in the client server communication.
ANS:

HTTP takes port in web browser communication. Hence it is called a communication protocol.
The basic feature of HTTP protocol is that it follows the request response model.
The client makes a request for desired web page by giving the URL in address bar.
This request is submitted to the web server and thenweb server gives the response to the web
browser by returning the required web page.

HTTP request message structure is fixed in ageneral form.


Through this message web client request message to the web server.

Figure shows communication between server client by using HTTP protocol.


For this there are many methods used as request methods which are as follows:

GET
POST
HEAD
OPTION
PUT
DELETE
TRACE
After request URL is used to identify the names or resources on the Internet.

Q5) Why HTTP is called as stateless protocol?


ANS:

Because the connection between the web server and the browser is not maintained. A request is
made to the server, and the server sends back stuff to the browser and disconnects.
It does not care who you are, it just needs to know where to send the data. For this reason, the
concept of sessions came to be.
For interactive content you have to maintain a connection, or at least a logical connection via a
session. Whatever service you are connecting to has to understand who you are, and that the
traffic you are sending is all part of the same session.

Q6) What do you mean by secure connection?


ANS:

The Internet is an insecure network and as a result your connections over this network are not
secure.
The goal of secure connections is to provide a secure channel over this insecure network.
These connections are done over encrypted protocols so that your data cannot be deciphered and
you can be sure that the server you are talking to is the authentic and intended one.

Without using secure connections, your internet traffic can be listened to by anyone who wants to
eavesdrop on your email that you are sending and receiving, the contents of your web traffic, and
worse they can easily obtain your login and password credentials, or impersonate our servers.
Secure connections ensures reasonable protection from eavesdroppers andimpersonators.

Q7) Write short note on Application Development tools.


ANS: There are various application and development tols available on the web.some resources on the
web are freeware or shareware
The freeware resources are those resources that can be downloaded freely on computer.
The shareware resources are those which can be tried by the user form limited time period and
they can be purchased.
The FTP can be used from the console window of the windows operating system to transfer the
file from one computer to another.
There are some graphics or audio conversion tools available using which data in one file format
can be converted to another.
The developers can make use of Integrated Development Environment(IDE)
Freeware resources can be used under different kinds of licenses. It may have restrictions such as
such resources can be used by Government agencies or armed forces.
Shareware resources can be available in trial versions. On expiring of trial version software need
to pay for and then can be used. For example WINZIP software.
There are some plug-ins available for developing the web application. Those plug-ins can be used
for HTML,PHP,PERL,JAVA Scripts and soon.
The developers can also make use of some online tools checking syntax of their source code. The
mini servers are also available which can be used for testing the code
Q8) What are the functions of web browsers?
ANS:The primary purpose of a web browser is to bring information resources to the user. This process begins
when the user inputs a Uniform Resource Locator (URL), for example http://en.wikipedia.org/, into the
browser. The prefix of the URL, the Uniform Resource Identifier or URI, determines how the URL will be
interpreted. The most commonly used kind of URI starts with http: and identifies a resource to be
retrieved over the Hypertext Transfer Protocol (HTTP). Many browsers also support a variety of other
prefixes, such as https: for HTTPS, ftp: for the File Transfer Protocol, and file: for local files. Prefixes that
the web browser cannot directly handle are often handed off to another application entirely. For
example, mailto: URIs are usually passed to the user's default e-mail application, and news: URIs are
passed to the user's default newsgroup reader.
In the case of http, https, file, and others, once the resource has been retrieved the web browser will
display it. HTML is passed to the browser's layout engine to be transformed from markup to an
interactive document. Aside from HTML, web browsers can generally display any kind of content that can
be part of a web page. Most browsers can display images, audio, video, and XML files, and often have
plug-ins to support Flash applications and Java applets. Upon encountering a file of an unsupported type
or a file that is set up to be downloaded rather than displayed, the browser prompts the user to save the
file to disk.

Information resources may contain hyperlinks to other information resources. Each link contains the URI
of a resource to go to. When a link is clicked, the browser navigates to the resource indicated by the link's
target URI, and the process of bringing content to the user begins again.

Prof. Ashish G. Revar


Asst. Prof., CE/IT Department,
MEFGI

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


Faculty of Engineering
Department of Computer Engineering & Information Technology
Issued Date: 16/1/2012

Deadline: 21/1/2012

Solution of Assignment#2
Short Questions (Hand written)
1) List three characteristics of HTML that make it ideal for the World Wide Web.
Ans. HTML is ideal for the Web because it is an open, nonproprietary language that is crossplatform compatible. All of the markup tags are included with every document and usually can be
viewed through your browser.
2) What improvements does XHTML promise over existing HTML?
Ans. One of the significant advantages of making HTML part of XML is that XML has stricter code
syntax. As more sites adopt XHTML, they will have to clean up code that does not match the
standard. With more Web sites using cleaner code, browsers have to do less work judging what is
correct code and what is not. Additionally, XHTML is designed to appear properly in browsers that
support HTML 4.0.
3) Explain the three issues you should consider when designing for multiple operating systems.
Ans. Monitors and display software, browser versions, and font choices
4) Describe some common reasons HTML code might not validate correctly.
Ans. The most common mistakes that will make your code invalid include:

Non DOCTYPE declaration


Missing closing tags, most commonly on paragraphs
Missing ALT attributes in IMG elements
Incorrect tag nesting
Unquoted attributes

5) Which HTML elements can you use to create a visual grid?


Ans. HTML tables or CSS positioning.
6) Explain active versus passive white space.
Ans. White space that is used deliberately is called active white space and is an integral part of
your design that structures and separates content. Sometimes the strongest part of a design is the
active white space. Passive white space includes the blank areas that border the screen or are the
result of mismatched shapes.
7) Difference the following terms:
Cellspacing Cell padding
Ans. Cell padding is used for formatting purpose which is used to specify the space needed
between the edges of the cells and also in the cell contents.
The general format of specifying cell padding is as follows:
< table width="100" border="2" cellpadding="5">

The above adds 5 pixels of padding inside each cell.


Cell spacing is one also used f formatting but there is a major difference between cell padding and
cell spacing. It is as follows: Cell padding is used to set extra space which is used to separate cell
walls from their contents. But in contrast cell spacing is used to set space between cells.
The general format of specifying cell spacing is as follows:
< table width="100" border="2" cellspacing="20">
One can also apply cell spacing and cell padding together. It is done as follows:
< table width="

" border=" " cellpadding="5" cellspacing =

>

Rowspan Colspan
Ans. Colspan and rowspan are html attributes used to span table cells across more than a column
or row. Colspan is short for column span or indicates how many across while a rowspan
indicates how many down .

8) What is frame? Explain with example.


Ans. A feature supported by most modern Web browsers than enables the Web author to divide
the browser display area into two or more sections (frames). The contents of each frame are taken
from a different Web page. Frames provide great flexibility in designing Web pages, but many
designers avoid them because they are supported unevenly by current browsers.

Prof. Ashish G. Revar


Asst. Prof., CE/IT Department,
MEFGI

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Faculty Name
Prof. Ashish G.
Revar (AGR)

Depart
ment
CE/IT

Subject/Subject
code
WAD(160705)
WTP(161602)

Semester
/Branch
6th CE
6th IT

Issued Date
30/1/2012

Due Date
3/2/2012

Solution of Assignment#3
1) What are the two parts of a style rule?
Ans. A style rule is composed of two parts: a selector and a declaration.
2) What are the three ways to combine CSS rules with your XHTML code?
Ans. You can combine CSS rules with XHTML code in the following three ways:
1) The style attribute
2) The <style> element
3) An external style sheet
3) List two reasons to state a style using the style attribute.
Ans. You generally use the style attribute to override a style that was set at a higher
level in the document, as when you want a particular heading to be a different color
from the rest of the headings on the page. The style attribute is also useful for
testing styles during development.
4) What are the advantages of using an external style sheet?
Ans. Placing style sheets in an external document lets you specify rules for multiple
Web pages.
5) Write a style rule that selects <ul> elements only when they appear within <p>
elements and set the color property to red.
Ans. p ul {color: red;}
6) What is the advantage of working with the id attribute?
Ans. Because id refers to only one instance of the id attribute value within a
document, this allows you to specify an id value and apply it to one unique element
in a document.
7) Explain CSS Box model.
Ans. The CSS Box Model
All HTML elements can be considered as boxes. In CSS, the term "box model" is used
when talking about design and layout.

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
The CSS box model is essentially a box that wraps around HTML elements, and it
consists of: margins, borders, padding, and the actual content.
The box model allows us to place a border around elements and space elements in
relation to other elements.

The image below illustrates the box model:

Explanation of the different parts:


Margin - Clears an area around the border. The margin does not have a
background color, it is completely transparent
Border - A border that goes around the padding and content. The border is
affected by the background color of the box
Padding - Clears an area around the content. The padding is affected by the
background color of the box
Content - The content of the box, where text and images appear
In order to set the width and height of an element correctly in all browsers, you need to
know how the box model works.
8)Explain the concept of pseudo class.
Ans. CSS pseudo-classes are used to add special effects to some selectors.
A pseudo-class is similar to a class in HTML, but its not specified explicitly in the
markup. Some pseudo-classes are dynamictheyre applied as a result of user
interaction with the document.

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
A pseudo-class starts with a colon (:). No whitespace may appear between a type
selector or universal selector and the colon, nor can whitespace appear after the
colon.
The syntax of pseudo-classes:
selector:pseudo-class {property:value;}
CSS classes can also be used with pseudo-classes:
selector.class:pseudo-class {property:value;}

Example
a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */

Prof. Ashish G. Revar


Subject In-Charge,
Computer Engineering,
MEFGI

Prof. Vipul M. Vekariya


Head of Department,
Computer Engineering,
MEFGI

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Faculty Name

Department

Prof. Ashish G. Revar (AGR)

CE/IT

Subject/Subject
code
WAD(160705)
WTP(161602)

Semester/Branch
6th CE
6th IT

Solution of Assignment # 4
1. What is difference between Java script and JAVA?
ANS:
Difference between Java and JavaScript
Java is an object oriented programming language whereas JavaScript is more of a
scripting language.

JavaScript is used to make the web pages more interactive. However, Java can be used not
only to make interactive web pages but can also be used to create server side applications
and standalone programming.
Java uses the concept of classes and objects that makes reuse of the code easier but there
is no such thing in JavaScript.
Java exhibits the properties like inheritance, data encapsulation and polymorphism
whereas JavaScript does not.

Java Script is used for front-end web development while Java can only be used as a backend language within a web environment.

Java doesn't need a web browser to compile and execute like Javascript does. Java is
compiled prior to runtime while Javascript is compiled at runtime.
2. Justify it: Java script is used in validation techniques .
ANS:

Java script is used in validation techniques is as follows:

The simple program allows a user to enter a password via form that is then accessed in
JS program.

This program serves to make a point about how to pick up details from the form; it
would not be feasible to check a password in these way as it would be insecure.

JS can be used to validate other details that are not as important.

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
Program:
<html>
<head>
<title>JS form</title>
</head>
<body>
<form method= post action=mailto:webmaster@localhost name= login onSubmit return
processForm >
<input type= text name= password >
<input type= submit value= login name= login >
</form>
<script type= text/javascript >
function processform()
{
var check=false;
myform=document.login;
if(myform.password.value== letmein
{
document.write hello world ;
check=true;
}
else
{
alert wrong password! ;
myform.password.focus();
}
}
</script>
</body>
</html>

If you want to check input from a user of an email address, the first thing to decide is
what the format of such an address could in all possible and legal cases.

A routine to validate an email should be check for invalid characters, check the
existence of the single @ and its positioning.

)t should be also check the . )s present in the domain name and again its positioning.

There are some good string manipulation an excess function built into JS. The presence
of a character and its positioning can be checked with:
o Strpos=stringName.indexOf @ ,startPos ;

The indexOf returns the position of characters,if it does not exist in the string then
returns -1.

Like these ways script of java is used in validation

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

3) Answer the following questions with respect to JavaScript.


I. Give the different purpose for which JavaScript is used.
ANS: There are few purpose and uses of JavaScript.

JS can be used as an alternative to java applet

JS can be effectively used for interaction with the user.

It can be embedded in XHTML.

It can be used to create cookies.

It can be used to detect the visitors,browsers and can load page accordingly.

It can be used to validate the data on webpage before submitting it.

II. Write user defined objects in JavaScript.


ANS: There are 3 Different ways to define objects in JavaScript
1. Create a direct instance of an object by using built-in constructor for the Object
class
2. Create a template (Constructor) first and then create an instance of an object from
it
3. Create object instance as Hash Literal
1: Creating a Direct Instance of a JavaScript Object
By invoking the built-in constructor for the Object class
personObj=new Object(); // Initially empty with no properties or methods
Add properties to it
personObj.firstname="John";
personObj.age=50;
Add an anonymous function to the personObj
personObj.tellYourage=function(){
alert This age is + this.age ;
}/
/ You can call then tellYourage function as following
personObj.tellYourage();
Add a pre-defined function
function tellYourage(){
alert The age is + this.age ;
}
personObj.tellYourage=tellYourage;
Note that the following two lines of code are doing completely different things
// Set property with a function
personObj.tellYourage=tellYourage;
// Set property with returned value of the function
personObj.tellYourage=tellYourage();

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
2: Creating a template of a JavaScript Object
The template defines the structure of a JavaScript object in the form of a function
You can think of the template as a constructor
function Person(firstname,lastname,age,eyecolor) {
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.tellYourage=function(){
alert This age is + this.age ;
}
}
Once you have the template, you can create new instances of the object
myFather=new Person("John","Doe",50,"blue");
myMother=new Person("Sally","Rally",48,"green");

You can add new properties and functions to new objects


myFather.newField = some data ;
myFather.myfunction = function() {
alert this["fullName"] + is + this.age ;
}

3: Creating JavaScript Object as a Hash Literal


Create personObj JavaScript object
var personObj = {
firstname: "John",
lastname: "Doe",
age: 50,
tellYourage: function () {
alert The age is + this.age ;
}
tellSomething: function(something) {
alert(something);
}
}
personObj.tellYourage();
personObj.tellSomething Life is good! ;

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
4) What are the advantages and disadvantages of using client-side programs?
ANS:
Advantages
Client-side scripts offer numerous advantages, including:

Allow for more interactivity by immediately responding to users' actions

Execute quickly because they don't require a trip to the server

May improve the usability of Web sites for users whose browsers support scripts

Can give developers more control over the look and behavior of their Web widgets (note
that this can be an advantage or disadvantage)

Can be substituted with alternatives (for example, HTML) if users' browsers do not support
scripts

Are reusable and obtainable from many free resources such as Hotscripts.com and
Javascript.com.
Disadvantages
Client-side scripts also create additional worries, including:

Not all browsers support scripts, therefore, users might experience errors if no alternatives
have been provided

Different browsers and browser versions support scripts differently, thus more quality
assurance testing is required

More development time and effort might be required (if the scripts are not already
available through other resources)

Developers have more control over the look and behavior of their Web widgets; however,
usability problems can arise if a Web widget looks like a standard control but behaves
differently or vice-versa.
5) Explain what is meant by event-driven programming.
ANS: When an events happen it triggers object that are associated with that kind of event.
Programming using this is called event driven programming.
6) What does the acronym DHTML stand for?
ANS: DHTML stands for Dynamic Hyper Text Markup Language.
7) Describe how client-side scripting can be used to enhance a website experience?
ANS:

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Script can execute on the client side or server.

Running a script on the client side saves processing time on the server.

The main two client side scripting languages are VB script and JS.

In client side scripting the web browser use its own resources and eases the burden on
the server.

Due to many advantages of using client side scripting it can be used to enhance a web
site experience

8) Explain conditional operator with example of JS.


ANS:The conditional operator is used as a shortcut for standard if statement. It takes three
operands.
Syntax
Condition ? expr1 : expr2
Parameters
condition : An expression that evaluates to true or false.
expr1, expr2 : Expressions with values of any types.
If condition is true, the operator returns the value of expr1; otherwise, it returns the value
of expr2.
Example : JavaScript Conditional Operator
In the following web document the conditional operator statement [status = (marks >= 30)
? "Pass" : "Fail"] assigns value "Pass" to the variable status if marks is 30 or more.
Otherwise it assigns the value of "Fail" to status.
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>JavaScript conditional operator example</title>
</head>
<body>
<h1 style="color: red">JavaScript conditional operator example</h1>
<hr />
<script type="text/javascript">
status = (marks >= 30) ? "Pass" : "Fail" ;
document.write(status);

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
</script>
</body>
</html>
9) Explain switch case with example of JS.
ANS: The switch statement is basically an enhanced version of the "if-else" statement that
is more convenient to use when you have code that needs to choose a path from many to
follow.
Eg:
<script type="text/javascript">
var message = 0;
switch (message) {
case 1: document.write('Merry Christmas'); break;
case 2: document.write('Happy New Year'); break;
case 3: document.write('Happy Easter'); break;
case 4: document.write('Happy Holidays'); break;
default: document.write('Welcome');
}
</script>
10) Explain Math with example of JS.
ANS: Javascript has a "Math" object. It is used whenever we want to do anything more than
simple arithmetic. It's basic syntax is Math.method(number).
JavaScript supports many arithmetic operations as well as the following math functions (or,
more precisely, methods of the Math object):
Math.abs(a)

// the absolute value of a

Math.acos(a) // arc cosine of a


Math.asin(a) // arc sine of a
Math.atan(a) // arc tangent of a
Math.atan2(a,b) // arc tangent of a/b
Math.ceil(a) // integer closest to a and not less than a
Math.cos(a)

// cosine of a

Math.exp(a)

// exponent of a (Math.E to the power a)

Math.floor(a) // integer closest to a, not greater than a


Math.log(a)

// log of a base e

Math.max(a,b) // the maximum of a and b

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
Math.min(a,b) // the minimum of a and b
Math.pow(a,b) // a to the power b
Math.random() // pseudorandom number 0 to 1 (see examples)
Math.round(a) // integer closest to a (see rounding examples)
Math.sin(a)

// sine of a

Math.sqrt(a) // square root of a


Math.tan(a)

// tangent of a

Example : calculates square root.


<html>
<head>
<title></title>
<script type="text/javascript">
function mySquareRoot()
{
mynumber = Math.sqrt(9);
alert(mynumber);
}
</script>
</head>
<body>
<a href="javascript:mySquareRoot()">Click here</a>
</body>
</html>
11) List out and discuss HTML events.
ANS:
Every element on a web page has certain eventswhich can trigger invocation of event
handlers
Attributes are inserted into HTML tags to define events and event handlers
Events

onabort - Loading of an image is interrupted


onblur - An element loses focus
onchange - The content of a field changes
onclick - Mouse clicks an object
ondblclick - Mouse double-clicks an object
onerror - An error occurs when loading a document or an image
onfocus - An element gets focus
onkeydown - A keyboard key is pressed

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
onkeypress - A keyboard key is pressed or held down
onkeyup - A keyboard key is released
onload - A page or an image is finished loading
onmousedown - A mouse button is pressed
onmousemove - The mouse is moved
onmouseout - The mouse is moved off an element
onmouseover - The mouse is moved over an element
onmouseup - A mouse button is released
onreset - The reset button is clicked
onresize - A window or frame is resized
onselect - Text is selected
onsubmit - The submit button is clicked
onunload - The user exits the page
onload & onUnload Events

The onload and onUnload events are triggered when the user enters or leaves the page
The onload event is often used to check the visitor's browser type and browser version,
and load the proper version of the web page based on the Information.
Both the onload and onUnload events are also often used to deal with cookies that should
be set when a user enters or leaves a page.
onFocus, onBlur and onChange
The onFocus, onBlur and onChange events are often used in combination with validation
of form fields.
Example: The checkEmail() function will be called whenever the user changes the content
of the field:
<input type="text" size="30"
id="email" onchange="checkEmail()">;
Example & Demo: onblur
<html>
<head>
<script type="text/javascript">
function upperCase() {
var x=document.getElementById("fname").value
document.getElementById("fname").value=x.toUpperCase()
}
</script>
</head>
<body>
Enter your name:
<input type="text" id="fname" onblur="upperCase()">

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
</body>
</html>
onSubmit
The onSubmit event is used to validate all form fields before submitting it.
Example: The checkForm() function will be called when the user clicks the submit button
in the form. If the field values are not accepted, the submit should be canceled. The function
checkForm() returns either true or false. If it returns true the form will be submitted,
otherwise the submit will be cancelled:
<form method="post" action="xxx.html"
onsubmit="return checkForm()">
Example & Demo: onSubmit
<html>
<head>
<script type="text/javascript">
function validate() {
// return true or false based on validation logic
}
</script>
</head>
<body>
<form action="tryjs_submitpage.htm" onsubmit="return validate()">
Name (max 10 chararcters): <input type="text" id="fname" size="20"><br />
Age (from 1 to 100): <input type="text" id="age" size="20"><br />
E-mail: <input type="text" id="email" size="20"><br />
<br />
<input type="submit" value="Submit">
</form>
</body>
</html>
onMouseOver and onMouseOut
onMouseOver and onMouseOut are often used to create "animated" buttons.
Below is an example of an onMouseOver event. An alert box appears when an
onMouseOver event is detected:
<a href="http://www.w3schools.com"
onmouseover="alert('An onMouseOver event');return false">
<img src="w3schools.gif" width="100" height="30">
</a>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
12) Explain keywords with respect to JS:
a. Constructor :The constructor property returns the function that created the array
object s prototype.
Syntax: array.constructor;

Example:<script type= text/javascript >

var fruits=[ orange , mango , apple ];


document.write(fruits.constructor);
</script>

b. DOM :Document object model is a set of platform independent and language neutral
application programming interface(API) which describes how to access and manipulate the
information stored in HTML,XHTML and JS document.
Example:<script type= text/javascript >

document.world (ello World ;


</script>

c. Method :They are the action that can be performed on objects.


Example:<script type= text/javascript >
var str= (ello World ;

document.write(str.toupper case());
</script>

d. Object :Object is a collection of properties and method.


Example:<script type= text/javascript>
var text= (ello World ;

document.write(text.length);
</script.

e. Property:The prototype property allows to add properties and methods to add object.
Example:< script type= text/javascript>

function employee(name,jobtitle,born)
{
this.name=name;
this.jobtitle=jobtitle;
this.born=born;

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
var fred=new employee abc , xyz , 99 ;
employee.prototype.salary=null;
fred.salary=20000;

document.write(fred.salary);
</script>
f. Regular Expression :It ia an object that describes a pattern of characters. It is y=used to
perform pattern matching and search and replace function on the text.
Example:<script type= text/javascript>
var str= All right ;
var pat=/[a-z]/g;
</script>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
WAP using HTML, CSS, JavaScript. Every answer must be having snapshot of the
output and it is required to have HTML, CSS, JavaScript code along with it.
1) Write down java script code to validate user name and password (password length must
in between 6 to 12 characters. User name should not start with _, @, or any number, both
are not blank). (Hint: Create regular expressions.)
Code Snippet:
<html>
<head>
<h2>Registration Form</h2>
<title>Registration Form</title>
<style type="text/css">
.err
{
visibility:hidden;
color:#0CC;
}
</style>
<script type="text/javascript">
function ValidateForm()
{
var fname=document.form1.fname.value;
var pwd=document.getElementById("pwd");
var pwd2=document.getElementById("pwd2");
var regexp=/^[^_@0-9][a-zA-Z0-9_@^]+$/;
if(fname=="")
{
alert("please enter first name");
document.getElementById("er1").style.visibility = 'visible';
return false;
}
else if(!regexp.test(fname))
{

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
alert("please enter proper name");
return false;
}
else if(pwd.value.length < 6 || pwd.value.length>12)
{
alert("please enter minimum 6 and maximum 12 characters of password");
return false;
}
else
{
alert("Thanks For Registration");
}
}
</script>
</head>
<body>
<form name="form1" onSubmit="return ValidateForm()">
<table>
<tr><td>First Name:</td>
<td><input type="text" size="20" maxlength="50" name="fname" /></td>
<td class="err" id="er1">Please enter first name:</td></tr>
<tr><td>Last Name:</td>
<td><input type="text" name="lastname"/></td>
<td class="err" id="er2">Please enter last name:</td></tr>
<tr><td>User Name:</td>
<td><input type="alphanumeric" name="login"/></td>
<td class="err" id="er3">Please enter your user name:</td></tr>
<tr><td>Choose a password:</td>
<td><input type="password" name="pwd" id="pwd" maxlength="12" /></td>
<td class="err" id="er4">Please enter password:</td>
<td class="err" id="er5">Please enter password minimum 6 characters:</td></tr>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<tr><td>Re-enter password:</td>
<td><input type="password" name="pwd2"id="pwd2"/></td>
<td class="err" id="er6">Please enter same password as of above:</td></tr>
<tr><td>Gender:</td>
<td><input type="radio" name="male" id="gen1"/>Male
<input type="radio" name="male" id="gen2"/>Female</td>
<td class="err" id="er7">Please select gender:</td></tr>
<tr><td></td>
<td><input type="checkbox" name="sign" id="term"/>I Agree to the terms and
conditions</td></tr>
<tr><td></td>
<td><input type="submit" value="signup"/></td></tr></table>
</form>
</body>
</html>
Output:

Fig : Snapshot for not entering proper name

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Fig : Snapshot for not entering proper password

Fig : Snapshot for thanking user for registartion

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
2) Write a JavaScript program to print first 100 odd numbers divisible by 7. (Hint: Use
MATH object.)
Code Snippet:
<!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=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript">
var i;
var count=0;
for(i=0;count<100;i++)
{
if(i%7==0 && i%2!=0)
{
document.writeln(i+"<br>");
count++;
}
}
</script>
</body>
</html>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
Output:

Fig : Snapshot for first prime 100 numbers divisible by 7


3) Write an HTML form accepting an integer having 4-digits. Provide necessary validations
using JavaScript. Input should not accept characters. (Hint: Create regular expressions.)
Code Snippet:
<!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=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript">
var i=prompt("Enter value");
var regexp=/^[0-9]+$/;
if(!regexp.test(i) || i.length!=4)

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
{
alert("Please enter 4 digit number only");
}
else
{
alert("Thanks for Registeration");
}
</script>
</body>
</html>
Output:

Fig : Snapshot of prompt box ready to accept input

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Fig : Snapshot which displays prompt box of above input

Fig : Snapshot for entering input to prompt box

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Fig :Snapshot which gives output for entering correct input


4) Generate below O/P with HTML, CSS and JS. Working form with client-side validation
controls.
Code Snippet:
ass.html
<!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=utf-8" />
<title>Untitled Document</title>
<link href="google.css" rel="stylesheet" />
</head>
<frameset rows="9%,91%" border="no" >
<frame src="top.html" />

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<frame src="bottom.html" />
</frameset><noframes></noframes>
</html>
top.html
<!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=utf-8" />
<title>Untitled Document</title>
<link href="google.css" rel="stylesheet" />
</head>
<body>
<div class="google" style="height:0px; width:100px"><img src="goo.jpg" align="middle"
height="35px"/></div>
<div class="google" style="padding-left:1000px; width:340px; height:35px">New To
Gmail?
<a href="form.html" target="_new"><button style="background-color:#F00;
height:30px">Create An Account</button></a></div>
</body>
</html>

form.html
<html>
<head>
<title> </title>
<body>
<form>
<table>
<th>Get started with Gmail </th><hr/>
<tr><td>First Name:</td>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<td><input type="text" name="firstname"/></td></tr>
<tr><td>Last Name:</td>
<td><input type="text" name="lastname"/></td></tr>
<tr><td>Desired login name:</td>
<td><input type="alphanumeric" name="login"/><font size="2" ><i>
@gmail.com</i></font></td></tr>
<tr><td></td><td>Examples:Jsmith,John.Smith</td>
<tr><td>Choose a password:</td>
<td><input type="password" name="pwd"/>Password Strength</td>
<td><font size="1">Minimum of 8 characters in length.</font></td></tr>
<tr><td>Re-enter password:</td>
<td><input type="password" name="pwd"/></td></tr>
<tr><td></td><td><input type="checkbox" value="stay" name="stay"/>Stay signed
in</td></tr>
<tr><td></td><td><input type="checkbox" value="stay" name="stay"/>Enable Web
History <a href="http://www.muskurahat.com/">Learn More</a></td></tr>
<tr><td></td><td><input type="button" type="submit" value="submit"
style="background-color:#39F"/><input type="button" type="reset" value="reset"
style="background-color:#39F"/></td></tr>
</form>
</body>
</head>
</html>
bottom.html
<!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=utf-8" />
<title>Untitled Document</title>
</head>
<frameset cols="70%,30%" border="no">
<frame src="left.html" name="page" />

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<frame src="right.html" name="page" />
</frameset><noframes></noframes>
</html>
left.html
<!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=utf-8" />
<title>Untitled Document</title>
<link href="google.css" rel="stylesheet" />
</head>
<body>
<h1 style="color:#C30; padding-left:100px; font-family:'Times New Roman', Times, serif;
font-weight:lighter">Gmail<br /></h1>
<h4 style="margin-left:100px; font-weight:lighter"> A Google approach to email.</h4>
<h5 style="margin-left:100px; font-weight:lighter">Gmail is built on the idea that email can
be more intutive,efficient and useful and maybe even fun. After <br />all, Gmail has:</h5>
<table style="margin-left:100px; font-weight:lighter"; cellspacing="20px" >
<tr><td><img src="gm1.png" /> </td>
<pre><td>Lots of space<br/>Over 7677.212174 megabytes(and counting) of free
storage</td></pre></tr>
<tr><td><img src="gm.png" /></td>
<td>Less spam<br/>Keep unwanted messages out of your inbox.</td></tr>
<tr><td><img src="gm2.png" /></td>
<td>Mobile Access<br/>Get Gmail on your mobile phone.<a href="learn.html"
style="color:#39C">Learn more</a></td></tr>
</table>
<a href="about.html" style="color:#39C; margin-left:100px">About Gmail</a>
<a href="about.html" style="color:#39C; padding-left:30px">New Features!</a>
<a href="about.html" style="color:#39C; padding-left:30px">Switch to Gmail</a>
<a href="about.html" style="color:#39C; padding-left:30px">Create an account</a>
</table>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<div style="margin-left:100px; border-color:#CCC; border-style:inset;
width:720px"><table>
<tr><td><img src="gm3.png" /></td>
<td><pre><h2><span class="color">New!</span>Get your own domain with Google Apps
for Business<br/></h2>Love Gmail,but looking for more custom email address for your
business?<br />Get branded email,calendar,and online docs @your_company.com.<a
href="learn.html" style="color:#39C">Learn more
>></a></pre></td></tr></table></div>
</body>
</html>
right.html
<!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=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<form style="background-color:#F4F4F7; width:340px">
<h2>Sign in
<img src="goo2.jpg" style="padding-left:150px" /></h2><br />
Username<br /><br />
<input type="text" name="usrnm" size="50" style="border-color:#39C"/><br /><br />
Password<br /><br />
<input type="password" name="pwd" size="50" /><br /><br />
<button style="background-color:#39F; height:40px; margin-left:20px">Sign in</button>
&nbsp;&nbsp;&nbsp;<input type="checkbox" name="sign" />Stay Signed in<br /><br />
<a href="cant.html" style="color:#000; margin:20px">Can't Access your account?</a>
</form>
</body>
</html>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

google.css
@charset "utf-8";
/* CSS Document */
.google
{
background-color:#F4F4F7;
padding-left:100px;
}
Output:

Fig :Snapshot of Gmail page

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
5) Generate below O/P with HTML, CSS and JS. Working form with client-side validation
controls.
Code Snippet:
ass-4.html
<!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=utf-8" />
<title>Untitled Document</title>
<link href="ass4.css" rel="stylesheet"/>
</head>
<body>
<table bgcolor="#CCCCCC" border="10" style="border:#F00">
<tr><td colspan="2" class="a">Note:Colums marked with * are compulsory to fill
in.</td></tr>
<tr><td align="right">Passport Office*:<select><option>select
ofiice</option></select></td>
<td align="right">District*:<select><option>select one</option></select></td></tr>
<tr><td align="right">Service Desired*:<select><option>select
one</option></select></td></tr>
<tr><td align="right">Surname:<input type="text" name="lname" /></td><td></td></tr>
<tr><td align="right">First Name*:<input type="text" name="fname"
/></td><td></td></tr>
<tr><td colspan="2" class="a">If you have ever changed your name click the box<input
type="checkbox" /> and indicate the Previous Name(s) in full</td></tr>
<tr><td colspan="2">Previous Name:<input type="text" /></td></tr>
<tr><td align="right">sex:<select><option>select
ofiice</option><option>male</option><option>female</option></select></td>
<td align="right">Date of Birth:<input type="text" size="10" />(DD/MM/YY)</td></tr>
<tr><td align="right">Place of Birth:<input type="text" /></td><td align="right">District
or Country:<input type="text" /></td></tr>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<tr><td align="right">Qualification:<input type="text" /></td><td
align="right">Profession:<input type="text" /></td></tr>
<tr><td align="right">Visible Marks*<input type="text" /></td><td
align="right">Height(cms)*<input type="text" /></td></tr>
<tr><td align="right" colspan="2">Present Address*(At Least First Two Address Lines are
to be filled) Permanent Address</td></tr>
<tr><td align="right"><input type="text" /></td><td align="right"><input type="text"
/></td></tr>
<tr><td align="right"><input type="text" /></td><td align="right"><input type="text"
/></td></tr>
<tr><td align="right"><input type="text" /></td><td align="right"><input type="text"
/></td></tr>
<tr><td colspan="2" height="20"></td></tr>
<tr><td colspan="2" align="right">Please give Date & Place residing at the Present
Address*<input type="text" size="10" />(DD/MM/YY)</td></tr>
<tr><td align="right">Phone No<input type="text" /></td>
<td>Mobile No<input type="text" /></td></tr>
<tr><td align="right">Email Address<input type="text" /></td><td></td></tr>
<tr><td colspan="2"><span class="a">Applicant's Family Information</span>(All Names
should be in full(including surname if any) Initials and titles are not allowed</td></tr>
<tr><td align="right">Marital Status*<select><option>Select Marital
Status</option><option>Single></option><option>Married</option></select></td><td>
Spouse's Name<input type="text" style="background:#6CF" /></tr>
<tr><td align="center" colspan="2">Father's Name<input type="text"
size="30"/></td></tr>
<tr><td align="center" colspan="2">Mother's Name<input type="text"
size="30"/></td></tr>
<tr>If you are not residing at the Present Address for the last one year, click on this
box<input type="checkbox" /> and furnish addresses of the other place(s) of residence in
the last one year along with the duration(s) of living there</tr>
<tr><td align="right">From<select><option>Select
Month</option><option>January</option><option>Febuary</option></select><select><
option>Select
Year</option><option>2001</option><option>2002</option></select></td><td
align="right">From<select><option>Select
Month</option><option>January</option><option>Febuary</option></select><select><
option>Select
Year</option><option>2001</option><option>2002</option></select></td></tr>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<tr><td align="right">To<select><option>Select
Month</option><option>January</option><option>Febuary</option></select><select><
option>Select
Year</option><option>2001</option><option>2002</option></select></td><td
align="right">To<select><option>Select
Month</option><option>January</option><option>Febuary</option></select><select><
option>Select
Year</option><option>2001</option><option>2002</option></select></td></tr>
<tr><td align="right">Address 1<input type="text" size="29" /></td><td align="right">
Address2<input type="text" size="29" /></td></tr>
<tr><td align="right"><input type="text" size="29"/></td><td align="right"><input
type="text" size="29" /></td></tr>
<tr><td align="right"><input type="text" size="29" /></td><td align="right"><input
type="text" size="29"></tr>
<tr><td colspan="2" height="20"></td></tr>
<tr><td>If you have a Demand Draft, click on this box<input type="checkbox"> and fill and
fill the details below:</td></tr>
<tr><td align="right">DD No.<input type="text" size="10"/></td><td></td></tr>
<tr><td align="right">DD Date<input type="text" size="10" /></td><td>Bank
Name<select><option>State Bank of India</option><option>Bank of
Baroda</option></select></td></tr>
<tr><td colspan="2">If you have held a passport or hold a passport at present, click on this
box<input type="checkbox" />and fill the details below:</td></tr>
<tr><td align="right">Old/Existing Passport No<input type="text" /></td><td
align="right">Issue Date<input type="text" />(DD/MM/YY)</td></tr>
<tr><td align="right">Place of Issue<input type="text" /></td><td align="right">File
Number<input type="text" /></td></tr>
<tr><td align="right">Date of Expiry<input type="text"
/>(DD/MM/YY)</td><td></td></tr>
<tr><td align="right">Access Code</td><td></td></tr>
<tr><td align="right">Enter Access Code*</td><td><input type="text" /></td></tr>
<tr><td align="right"><button
style="background:#C60">Save</button></td><td><button
style="background:#C60">Re-Print Form</button></td></tr>
</table>
</body>
</html>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
ass4.css
@charset "utf-8";
/* CSS Document */
.a
{
color:#C00;
}
Output:

Fig : Snapshot of passport information table

Prof. Ashish G. Revar


Subject In-Charge,
Computer Engineering,
MEFGI

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Faculty Name

Department

Prof. Ashish G. Revar (AGR)

CE/IT

Subject/Subject
code
WAD(160705)
WTP(161602)

Semester/Branch
6th CE
6th IT

Solution of Assignment # 5
1) Give merits and demerits of DTDs in XML.
ANS:
Advantages:
1. Of the primary three languages, DTDs are the only ones that can be defined inline. That
is, the DTD can actually be embedded directly into the document.
2. DTDs can define more than merely the content model. It can define data elements that
can be used in the document; much like a C or C++ preprocessor may have #defines
that are used internally.
3. The DTD language is compact and highly readable, though it does require some
experience to understand.
Disadvantages:
1. The primary disadvantage to DTDs is their weakness of specificity. The content models
for DTDs are very basic, particularly compared to the other two languages.
2. Overuse of DTD-defined elements may make a document illegible or incomprehensible
without the associated DTD.
3. The language that DTDs are written in is not XML. Therefore, DTDs cannot use the
various frameworks that have been built around XML. XML editors that support
writing DTDs must do so by parsing an additional language.
4. The DTD concept for XML was borrowed from the SGML DTD concept. As such, the
construct could not be changed when XML was extended with namespaces. As such,
DTDs are namespace unaware.
5. There is limited support for defining the type of the contained data. DTDs are primarily
structural in nature. They do not have the ability to specify that an element contains an
integral number, real number, a date, or anything of that nature.
2) Give advantages and disadvantages of XML schemas.
ANS:
Disadvantages

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
1. W3C XML Schema is complex and hard to learn, although that's partially because it tries
to do more than mere validation
2. Although being written in XML is an advantage, it is also a disadvantage in some ways.
The W3C XML Schema language in particular can be quite verbose.
3. Likewise, WXS's formal mechanism for associating a document with a schema can pose
a potential security problem. For WXS validators that will follow a URI to an arbitrary
online location, there is the potential for reading something malicious from the other
side of the stream.
4. W3C XML Schema does not implement most of the DTD ability to provide data elements
to a document. While technically a comparative deficiency, it also does not have the
problems that this ability can create as well, which makes it a strength.
5. An XML file may not be usable in the absence of its schema, even if the document would
validate against that schema. It can also dramatically slow down processing of the
document, as the processor must potentially download and process a second XML file
(the schema).
3) Clearly explain the advantages of XML schemas over DTDs.
ANS:
Advantages of XML over DTDs
1. Compared to DTDs, W3C XML Schemas are exceptionally powerful. They provide much
greater specificity than DTDs could. They are namespace aware, and provide support
for types.
2. W3C XML Schema is written in XML itself, and therefore has a schema of its own
(appropriately, written in W3C XML Schema).
3. W3C XML Schema has a large number of built-in and derived data types. These are
specified by the W3C XML Schema specification, so all W3C XML Schema validators and
processors must support them.
4. Due to the nature of the schema language, after an XML document is validated, the
entire XML document, both content and structure, can be expressed in terms of the
schema itself. This functionality, known as Post-Schema-Validation Infoset (PSVI), can
be used to transform the document into a hierarchy of typed objects that can be
accessed in a programming language through a neutral interface.
4) Give the significance of namespaces in XML.
ANS:
The true name of an XML element or attribute is not just the string you see in its text
form. It actually consists of that "local" name combined with the namespace URI. This
combination forms the "qualified name".Take a look at the following two XML extracts:
<quantity>5</quantity>
<edi:quantity

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
xmlns:edi='http://ecommerce.example.org'>5</edi:quantity>
Both are "quantity" elements. Both have the same content. However, the second
element is defined within a namespace scope. Its fully qualified name consists of the
namespace URI (http://ecommerce.example.org) and the local name (quantity). Mind
that the "edi" prefix is of no consequence; it only serves to bind the element to the
namespace.
If both these elements were used in the same XML document, they would in fact not
be equivalent. Namespaces can serve to create elements with the same local names
but with a different meaning. This is important when mixing XML data from different
contexts, while the meaning of each part must be maintained.
An example of such a mixed environment is XML embedded in web pages. Suppose we
created a page in XHTML. A part of this page might consist of an XML document,
perhaps with its own associated style sheet. Suppose that XML document contained
an element with local name "table".
If the web browser used to view the page just read all markup it recognized, it would
try to interpret that element as a HTML table. However, in the context of the XML
document, the table tag might have a totally different meaning. It might in fact model a
database table.
A way to solve this would be to use the XHTML namespace as the default namespace
for the web page. The XML document could then explicitly use the XML namespace. An
XHTML and XML compliant web browser would then only interpret the elements in
the XHTML namespace as HTML markup, using only these to format the page. The
XML document would be handled in its own way, possibly using a style sheet.
In short, namespaces are used to allow different XML vocabularies to be mixed
without creating conflicts of meaning.
5) Explain the following terms related to XML.
a) XML parsing
b) XML validators
ANS:
XML PARSER:

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
A parser is a piece of program that takes a physical representation of some data and
converts it into an in-memory form for the program as a whole to use. Parsers are
used everywhere in software.
An XML Parser is a parser that is designed to read XML and create a way for
programs to use XML. There are different types, and each has its advantages. Unless
a program simply and blindly copies the whole XML file as a unit, every program
must implement or call on an XML parser.
XML VALIDATORS:
The validation of XML document is done by XML validators.
It can be done using two approaches.
1. Checking the well formedness of XML document that means that if any
bracket is missing or additional is tested by checking the formedness of the
XML document.
2. Checking the validity of the XML elements.
6) Write XML schemas which will display the book information with
Title of the book
Author name
ISBN Number
Publisher name
Price
Make use of CSS and DTD. Also use the XSL file for displaying the contents in tabular
form. The table header must be displayed in capital letters. All the author names
must be in upper case. Each column of the table must be displayed in different colors.
ANS:
Catalog.xsd
<?xml version="1.0" encoding="UTF-80"?>
<xs:schemaxmnls:xs="http://www.w3.org/2001/XMLSchema">
<xs:element name="Catalog">
<xs:complexType>
<xs:sequence>
<xs:element ref="Book" minOcccurs="1" maxOcuurs="unbounded"/>
</xs:sequence>
</xs:complexType>
</xs:element>
<xs:element name="Book">
<xs:complexType>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<xs:sequence>
<xs:element ref="Title" minOccurs="1" maxOccurs="1"/>
<xs:element ref="Author" minOccurs="1" maxOccurs="1"/>
<xs:element ref="Publication" minOccurs="1" maxOccurs="1"/>
<xs:element ref="Edition" minOccurs="1" maxOccurs="1"/>
<xs:element ref="ISBN" minOccurs="1" maxOccurs="1"/>
<xs:element ref="Price" minOccurs="1" maxOccurs="1"/>
</xs:sequence>
</xs:complexType>
</xs:element>
<xs:element name="Title" type="xs:string"/>
<xs:element name="Author" type="xs:string"/>
<xs:element name="Publication" type="xs:string"/>
<xs:element name="Edition" type="xs:string"/>
<xs:element name="ISBN" type="xs:string"/>
<xs:element name="Price" type="xs:string"/>
</xs:schema>
CatalogDemo.xml
<Catalog>
<Book>
<Title>XML Bible</Tile>
<Author>Winston</Author>
<Publication>Wiely</Publication>
<Edition>Fifth Edition</Edition>
<ISBN>0-7465-4760-7</ISBN>
<Price>$40.5</Price></Book>
<Book>
<Title>Artificial Intelligence</Tile>
<Author>S. Russel</Author>
<Publication>Princeton Hall</Publication>
<Edition>Sixth Edition</Edition>
<ISBN>0-13-1038-2</ISBN>
<Price>$63</Price>
</Book>
<Book>
<Title>Java 2</Tile>
<Author>Watson</Author>
<Publication>BPB Publication</Publication>
<Edition>Third Edition</Edition>
<ISBN>0-41-1058-0</ISBN>
<Price>$63</Price>
</Book>
<Book>
<Title>HTML in 24 hours</Tile>
<Author>Sam Peter</Author>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<Publication>SAM Publication</Publication>
<Edition>Fifth Edition</Edition>
<ISBN>0-672-32841-0</ISBN>
<Price>$50</Price>
</Book>
</Catalog>
Library.css
Catalog
{
font-family:arial;
color:#FF0000;
font-size:16px;
}
Book
{
display:block;
font-family:"Times New Roman", Times, serif;
color:#0000FF;
table-layout:auto;
font-size:14px;
}
Title
{
font-family:arial;
color:green;
font-size:12px
}
Author
{
font-family:Arial, Helvetica, sans-serif;
color:magenta;
}
Publication,Edition,ISBN,Price
{
display:block;
font-family:Arial, Helvetica, sans-serif;
color:#000000;
font-size:10px;
margin-left:20px;
}
XSL File:<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="www.w3.org">
<xsl:template match="/">

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<html>
<body>
<center>
<h2>Books Information</h2>
<table border="1">
<trbgcolor="gray">
<TH>Title</TH>
<TH>Author</TH>
<TH>Publication</TH>
<TH>Edition</TH>
<TH>Price</TH>
</tr>
<xsl:for-each select="Catalog/Book">
<tr>
<td bgcolor="green"><xsl:value-of-select="Title">
<td bgcolor="red"><b><xsl:value-ofselect="translate(Author,'abc','abcd','abcdef')"</b></td>
<td bgcolor="cyan"><xsl:value-of-select="Publisher"/></td>
<td bgcolor="yellow"><xsl:value-of-select="ISBN"/></td>
<td bgcolor="silver"><xsl:value-of-select="Edition"/></td>
<td bgcolor="magenta"><xsl:value-of-select="Price"/></td>
</tr>
</xsl:for-each>
</table>
</center>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
XML File:<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="b_catalog_xsl"?>
<Catalog>
<Book>
<Title>Xml</Title>
<Author>Winston</Author>
<Publication>Wiley</Publication>
<Edition>Fifth</Edition>
<ISBN>0-7845-4151</ISBN>
<Price>$40.5</Price>
</Book>
<Book>
<Title>AI</Title>
<Author>Russel</Author>
<Publication>MG HIll</Publication>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
<Edition>Fifth</Edition>
<ISBN>0-7845-4</ISBN>
<Price>$63</Price>
</Book>
<Book>
<Title>HTML</Title>
<Author>Sam peter</Author>
<Publication>Pearson</Publication>
<Edition>Fifth</Edition>
<ISBN>0-7845-445</ISBN>
<Price>$50</Price>
</Book>
</Catalog>
7) Develop an XML document that will hold a music collection with fields for artist
name, record company, date released and format (CD, Minidisk, DVD).
Develop a DTD for your XML music collection document.
Develop a schema for your XML music collection document.
Parse and validate your document.
ANS:

<?xml version="1.0" encoding="ISO-8859-1"?>


<!DOCTYPE CATALOG SYSTEM "q7.dtd">
<CATALOG>
<CD>
<TITLE>DISCO DANDIYA</TITLE>
<ARTIST>FALGUNI PATHAK</ARTIST>
<COMPANY>T-SERIES</COMPANY>
<PRICE>20/-RS</PRICE>
<YEAR>2006</YEAR>
</CD>
<CD>
<TITLE>SPECIAL HITS</TITLE>
<ARTIST>A.R.REHMAN</ARTIST>
<COMPANY>UNIVERSAL</COMPANY>
<PRICE>35/-RS</PRICE>
<YEAR>2004</YEAR>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
</CD>
<CD>
<TITLE>BOLLYWOOD BADSHAH</TITLE>
<ARTIST>SONU NIGAM</ARTIST>
<COMPANY>SONG BMG</COMPANY>
<PRICE>30/-RS</PRICE>
<YEAR>2010</YEAR>
</CD>
<CD>
<TITLE>GOLDEN YEAR</TITLE>
<ARTIST>SHANKAR MAHADEVAN</ARTIST>
<COMPANY>SPECIAL EFFECTS</COMPANY>
<PRICE>20/-RS</PRICE>
<YEAR>1999</YEAR>
</CD>
</CATALOG>

Prof. Ashish G. Revar


Subject In-Charge,
Computer Engineering,
MEFGI

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

Faculty Name

Department

Prof. Ashish G. Revar (AGR)

CE/IT

Subject/Subject
code
WAD(160705)
WTP(161602)

Semester/Branch
6th CE
6th IT

Solution of Assignment # 6
1. How do you create cookie in PHP? Give difference between session
and cookie with example.
ANS:
The cookies can be created using setcookie() function. if PHP code is embedding in
HTML script then setcookie() functionmust appear before <html> tag.
Syntax: setcookie(cookiename,value,expire,path,domain);
For Example: $value= some value ;
Setcookie MyCookie ,$value ;
Setcookie MyCookie ,$value,time +3600 ;
Session
1. Session can store any type of
data because the value is of data
type of "object"
2. These are stored at Server side

Cookies
1. Cookies can store only "string" data type

3. Session are secure because it is


stored in binary format/encrypted form and it gets decrypted at
server

3. Cookie is non-secure since stored in text


format at client side

4. Session is independent for


every client i.e. individual for
every client

4. Cookies may or may not be individual for


every client

5. There is no limitation on size


or number of sessions to be
used in an application

5. Due to cookies network traffic will increase.


Size of cookie is limited to 40 and number of
cookies to be used is restricted to 20.

2. They are stored at Client side

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
6. For all conditions/situations we
can use sessions

6. Only in few situations we can use cookies


because of no security

7. We cannot disable the sessions.


Sessions can be used without
cookies also(by disabling
cookies)
8. The disadvantage of session is
that it is a burden/overhead on
server

7. We can disable cookies

9. Sessions are called as NonPersistent cookies because its


life time can be set manually

9. We have persistent and non-persistent


cookies

8. Since the value is string there is no security

2. Whats PHP? Write down source code to create database and retrieve
data with connection of PHP.
ANS:
PHP is a scripting language that is combined with HTML, either by embedding it within
a web document or by using it as a file that is prossed alongside it, but on the server
side!
PHP Script:
<?php
echo $_POST['fname'];
echo $_POST['lastname'];
$con = mysql_connect("localhost","root","");
if(!$con)
{
die('Error'.mysql_error());
}
mysql_select_db("database",$con);
$detail="INSERT INTO details(firstName,lastName,userName,password,gender)
VALUES('$_POST[fname]','$_POST[lastname]','$_POST[login]','$_POST[pwd]','$_POST[stay]'
)";
if(!mysql_query($detail,$con))
{
die('Error'.mysql_error());
}
mysql_close($con);
?>

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING

3. How do you connect to server with PHP? Explain with example.


ANS:
Before accessing the database in MYSQL from PHP it is necessary to establish a
connection between them using mysql_connect function.
Syntax: mysql_connect(Name of server,usename,password);
PHP Script Example:
<?php
echo $_POST['fname'];
echo $_POST['lastname'];
$con = mysql_connect("localhost","root","");
if(!$con)
{
die('Error'.mysql_error());
}
else
{
echo "Connected";
}
mysql_close($con);
?>
4. What are basic commands of PHP? Explain with example.
ANS:
The basic commands of PHP are echo,mysql_connect() function.
First of all create some database in MYSQL for that purpose we can use the commands
discussed.
Before accessing the database in MYSQL ,from PHP it is necessary to establish a
connection between them.
mysql_connect() function is used to establish a connection between PHP and MYSQL.
The syntax of mysql)_connect is mysql_connect(Name of server,username,password)
Example:
<?php
$con=mysql_connect localhost:3306/ mydb , root , my password ;
if($con)
{
die Error mysql_error
}
else
{
echo connected ;

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
}
my sql_close($con);
?>

5. Write a PHP program to make the sum of first 100 odd numbers.
ANS:
PHP Script:
<?php
$sum=0;
for($i=1;$i<=200;$i++)
{
$sum=$sum+$i;
$i++;
}
echo "Addition of first 100 odd numbers is:".$sum;
?>
6. Describe following terms:

a. str_replace()
b. strtolower()
c. strstr()
d. $_FILES[]
ANS:
a. str_replace():
Syntax: str_replace($search,$replace,$string,$count).
Functions: It search within the full string and replace with the replacing keyword
and also return how many time these function has replace the value of given word.
b. strtolower():
Syntax: strtolower($string).
Functions: It converts all characters in string to lowercase.
c. strstr():
Syntax: strstr($string1, $string2).
Functions: It finds string 2 inside sy[tring 1 and if it is not found returns false
otherwise returns that portions of string 1 that contains it.
d. $_FILES[]:
Syntax:$size=$F)LES[ File ][ Size ];
Function:$FILES() are used to fetch initial name of the file and file size.

MARWADI EDUCATION FOUNDATIONS GROUP OF INSTITUTIONS


FACULTY OF ENGINEERING, GAURIDAD CAMPUS.
DEPARTMENT OF COMPUTER ENGINEERING
7. Why are cookies not the best secure way to keep information

available?
ANS:
Cookies can be used to carry information throughout a website about a particular
visitor, but cookies are not the best secure way to keep informable.
Because they are very simple in method to store information.
Also cookies can be deleted or can be changed by user so it will create a problem to
store information.
Cookies are not safer for e-commerce, to ensure information is available across the
pagers without relaying on the visitor s browser.
For these reason cookies are not the best secure way to keep information available.
8. Explain enctype with respect to HTML and PHP.
ANS:
The enctype attribute specifies how the form data should be encode when
submitting it the server.
The enctype attribute of the form> tag specifies which content-type to use when
submitting the form.
Syntax: <form enctype= value >
Example:
<form action= demo_post enctype.php method= post enctype= multiport
form_data >
First name:<input type= text name=fname ><br>
Last name:<input type= text name=lname ><br>
(ere multipart form_data is used when a form requires binary data, like the
contents of a file, to be uploaded.
Allowing users to upload file is a big security risk. Only permit trusted users to
perform file uploads.

Prof. Ashish G. Revar


Subject In-Charge,
Computer Engineering,
MEFGI