You are on page 1of 43

UNIT 1

1) WEB STANDARDS

1) Advantage of WEB Standard


1) Clear Markup
Web standard insist you that to write clean, valid, and modular markup
code for the standard web page. It simplifies the code and make easier to develop
for trouble shoot and make easier to user to use.

2) Forward And Backward Capability


Web standard is just not design for current use but it also scatter the older
browser and upgrade the newer browser also.
Because of this feature web page created by older version will never get
degrade?

3) Accessibility
Web standard help to make your web page accessible for the wide range of
user including the older users knowledgeable user and poor user/ new user.

4) Cross Browser Capability


It is the most important feature of the web standard it shift your web pages
among the all available web browser.

5) SEO (Search Engine Optimization)


By compiling your web code by using web standard can archive better
optimization with search engine and allow user to search your web site easily.

6) Code Minimization & Easy Maintenance


By using separate CSS for every function you can minimize your line of
code. Which makes your web page light weight and easy to maintain by doing
little bit of change in the functioning of CSS.
Desperation of code also save developing time of web page and you can
also reuse them.

7) Faster Loading and Less Bandwidth


By using CSS in standard way you can make your web page faster and you
can load the large size of data. Like images or video without any interrupt.
Standardized port and light weight web page also save the bandwidth and
decrease the load of server.
2) Basic web designing
8) Architecture of Web Browser
User Interface

Network Interface

Browser Engine

Support Library, web standards, Server Interface

Layout Engine

9) Web Page

Fig. Static Web Page.


Web page can be ether static or dynamic (Unchanged or Constant). Static
web page contents the same previewed contents each time when page is loaded
and if required professional developer to make changes in it.

2) Dynamic web page

Other than static dynamic web page have .PHP, .ASP, .HTML extensions and
this pages content server side code. Which can be changed every time? When the
page is loaded there for a dynamic web page is a live or interactive web page.

3) Web-Site
A web site is a collection of web pages, images, video, or other digital
assets. That is hosted on 1 or several web servers, usually accessible via internets
cell phones, LAN.

1) Home page
It is a main page of web site which gives detail information about the web
site and provides link to all other parts of your web portal and it is the first page
seen by every visitor. It is also known as indexed page as it provides a link and
detailed about all other. Home page is initial page of web site and it is point of
entry to all the information stored in a data server and in web site.

2) Web Server
It is a program which uses client server model and HTTP proto call to serve
the files and feature of engine to the web page and there user.

3) Client
A client is application or a user which communicate with server using web
browser and HTTP proto call to access the required information.

4) Internet Domain

3) TCP / IP (Transfer Control Protocol / Internet Protocol)


Is a collection of services, application, and protocol.
Application is used for communication purpose between 2 systems.
Services are used for handling data transferring, file creating, creating link,
and closing the connection.
Services are accessed using application.
Protocol defines the set of rules for data transmission.
TCP/IP is a combination of 5 layers for successful interaction and
communication.

1) Physical Layer
It is a purely H/W based layer. It is available in an every network. It includes
cabals, satellite devices, data cards and every other medium physically connected
in a network.

2) DLL
This layer is responsible for splitting a received data into smaller packets
which can be send over the network using connection media. Once it is send to
network DLL acknowledge network layer for the further action.

3) Network Layer
Takes packets of data from DLL verify it and send it to the correct path for
the further process. It also fixes the most suitable root for the packet in the
network.

4) Transport Layer
After Network layer fixed and show the root to the packet still network
layer is not responsible for the receiving packet on the destination successfully.
IT is responsibility of transport layer to post your packet successfully on
specified IP address. Transport layer also responsible for the acknowledgement of
received packet.

5) Application Layer
It is the layer which content application that the user use to access, send,
receive the data.

6) IP
Is responsible for basic connectivity between source and destination. It is
present in network layer of TCP and it play important role in establishing a
connection in network. It is use IP address of source and destination to establish a
secure connection.

7) FTP
File Transfer Protocol is a set of rule for exchanging files over the internet.
FTP works with TCP/IP protocol and completes your file transfer work successfully
using global internet and FTP server.

8) TELL NET
Tell Net is a network protocol used on the internet or also in local network.
It provides a bidirectional interactive text oriented commands line
communication facility using terminal base connection.

1) Basic Tags of HTML (Basic Structure of HTML)


A tag is a unit of markup. It is set of symbols defined in HTML to have a
special meaning. Tags start with < sing and ends with > sing, this is called as
angle bracket.
All basic tags are paired tags, because all tags have a start and end. Every
web page consists of few tags. Among that a page has a compulsory required tag.
Ie. Called as basic tag without basic tag we cannot prepare any web page.
For ex.
<HTML>
<HEAD>_______</HEAD>
<TITLE>________</TITLE>
<BODY>_______</BODY>
</HTML>

1) <HTML>___</HTML> Tag
It is used to create a web page that means start of web page. It is paired tag
along with also have an end of web page </html>.

2) <HEAD>____</HEAD> Tag

Every web page has an appropriate heading to display web page heading.
Head tag is used. The heading is placed in between head tag will be display in
header area of web page. It is a paired tag so has a closing tag </HEAD>.

3) <BODY>_____</BODY> Tag
This tag is used for web page content we can placed the document ie. Text,
audio, video, etc. in a web page body. It is a paired tag so have a closing.
</BODY>.
2) PHYSICAL STYLE TAG
These tags are used to provide styling to the document.

1) <B>_____</B> BOLD Tag


This tag is used to display document in bold format. This is paired tag so
have a closing.

2) <I>_____</I> ITALIC Tag


This tag is used to display document in italic format. This is paired tag so
have a closing.

3) <U>____</U> UNDERLINE Tag


This tag is used to display document with underline. This is paired tag so
have a closing.

3) <SUB>_____</SUB> SUBSCRIPT Tag


This tag is used to display based value. The full form of sub is subscript. This
is paired tag so have a closing.
Ex. H <SUB> 2 </SUB>.

4) <SUP>____</SUP> SUPPERSCRIPT Tag


This tag is used to display the text in supper script form. This is paired tag
so have a closing.
Ex. H <SUB> 2 </SUB>+B <SUO> 2 </SUP>.

5) HEADING LEVELS
We can provide multiple heading levels for the text following heading levels
are available in HTML.

1) <H1>_____</H1>
2) <H2>_____</H2>
3) <H3>_____</H3>
4) <H4>_____</H4>
5) <H5>_____</H5>
6) <H6>_____</H6>

<H1> is the biggest heading level and <H6> is the smallest heading level.
Other heading levels in between this 2 respectively.

6) TABLE TAG ATTRIBUTES


SR.NO. ATTRIBUTE
1.
ALIGN
2.
VALIGN

OPTION
FUNCTION
RIGHT,LEFT,CENTER Use for align table horizontally.
TOP, BOTTOM,
To align data vertically.
MIDDLE.

3.

NUMERICAL
CONSTANT/COLOR
NAME.
BACKGROUND URL/PATH

4.
5.
6.
7.
8.
9.
For ex.

BGCOLOR

To apply bg color to table.

HEIGHT
WIDTH
TITLE
ROWSPAN
COLUMNSPAN

Set the background image for


table.
To set height of table.
To set width of table.
To give title to the table.
To give area of row.
To define area of column.

NUMERICAL VALUE
NUMERICAL VALUE
USER DEFINED
NUMERICAL VALUE
NUMERICAL VALUE
2

6
7

8
10

<HTML>
<HEAD> <B> <H1> TABLE </H1> </B> </HEAD>
<TITLE> TABLE </TITLE>
<BODY BGCOLOR=SKYBLUE>
<CENTER>
<TABLE BORDER=5 CELLSPACING=2 CELLPADDING=2>
<TR>
<TD ROWSPAN=4> 1 </TD>
<TD COLUMNSPAN=3> 2 </TD>
<TD ROWSPAN=4> 3 </TD>
<TD ROWSPAN=2> 4 </TD>
</TR>
<TR>

3
9

<TD ROWSPAN=2> 5 </TD>


<TD COLSPAN=2> 6 </TD>
<TD ROWSPAN=2> 9 </TD>
</TR>
<TR>
<TD ROWSPAN=1> 7 </TD>
<TD> 8 </TD>
</TR>
<TR>
<TD COLSPAN=3> 10 </TD>
</TR>
</TABLE>
</CENTER>
</BODY>
</HTML>

6) INTRODUCTION TO FRAMESET TAG


Frames where originally used in the net scope navigator lab and later it is
implemented by Microsoft internet explorer.
Once a layout of the frame is divided then you can load HTML page along
with the text image and multimedia content and website links also.
Frame tag permits the division of the page into several rectangle areas and
each one of which capable to display separate document.

Each one of this rectangle is called as frame since the content of the frame
are independent of each other to. They can also be hyperlink to each other and
frames can be resided depending upon their screen resolution.
<FRAMESET ATTRIBUTES=VALUES>
<FRAME ATTRIBUTE=VALUES/>
</FARAMESET>

For ex.
<HTML>
<TITLE> FRAME </TITLE>
<FRAMESET ROWS=60%, 40% COLS=70%, 30%>
<FRAME SRC=FILE1.HTML/>
<FRAME SRC=FILE2.HTML/>
<FRAME SRC=FILE3.HTML/>
<FRAME SRC=FILE4.HTML/>
</FRAMESET>
</HTML>

8) CREATON OF FRAME
The frameset tag defines the general layout of web page that contents the
various frames.
It creates a table of document in which each rectangle called frame
contains the separate data and different work.
In simple frameset tag defined how many column and row will be there in a
page.
Frame tag always goes inside the frameset tag.

When the user click on the link of a file 1 the browser goes out and retrieve the
file 1 which will appear in the area of frame 1.

1) COLUMN/ROWS
Column/ rows are the attributes of frameset tag which sets the size of the
column and row. In a frameset tag we can use only one row and one column
attribute. The value for each attributes is in a list of sizes in % separate by coma.
SR.NO. ATTRIBUTE
1.
BORDER

OPTION
NUMBERS

2.

BORDERCOLOR

3.

MARGIN WIDTH

HEX
NO/COLOR
NAME
PIXEL

4.

MARGINE HEIGHT

5.

FRAMEBORDER

6.

SCROLLING

7.

FRAME SPACING

8.

NAME

9.

NO-RESIZE

10.

TARGET

DISCRIPTION
Display the border around the hole
frame
To give the color to the frame border.

Set the internal left and right margin


of the frame.
PIXEL
Set the internal top and bottom
margin of the frame.
NO, 0, 1.
It sets the border around the internal
frame of page. It takes two values ie. 0
& 1. By default it set to 1.
YES, NO,
There should be a scrollbar on the
AUTO.
right and the bottom of frame. It has 3
values yes, no, auto. Yes keeps the
scrollbar on, no sets the scrollbar to
the off, auto will set if there is need of
scrollbar and if no scrollbar
automatically.
PIXEL
Set the clear space around the frame.
In the given pixel sizes.
CHARECTOR This attribute assign the name to the
frame and it is used for targeting
purpose.
NAME OF
Prevent user from resizing the frame
FRAME
dynamically dragging.
NAME OF
It is used to target another frame.

FRAME

10) TARGETING THE FRAME


Linking is the major advantage of using frames in the HTML.
Linking the frame is simply creating a menu of available things in the left of
web page and displaying its content in the right side frame.
For targeting the frame it is very important to give the name to the frame.
<FRAMESET ROWS=NUMBER COLS=NUMBER>
<FRAME SRC=ADDRESS NAME=NAME OF FRAME/>
</FRAMESET>
After naming the frame next step is to target the web page. For targeting
we have to use an ANCHOR tag.
The main function of target frame is to load the specified page in a
directed frame. The receiving frame also have specified name.
11) 4 MAGICAL ATTRIBUTE OF TARGET COMMAND
1) TAREGT=SELF
The self target the same frame of a link and open the desire frame page
in self mode.
2) TARGET=BLANK
Open a blank frame when you click on the link.
3) TARGET=TOP
The top target opens a link in a new window and that window appears
on top.
4) TARGET=PARENT

Target will open frame into current window by overwriting all other
frame.

12) INLINE FRAME


Inline frame are also called as floating frames because they can be
position anywhere in your page. You can place them for the better control over
the content of web page.
<IFRAME SRC=ADDRESS HEIGHT=SIZE IN NUMBER WIDTH=SIZE IN NUMBER
ALIGN=BASE LINE>
</IFRAME>
13) ATTRIBUTE OF INLINE FRAME
SR.
NO.
1.

ATTRIBUTE

OPTION

DISCRIPTION

BORDER

NUMBER

2.

BORDER COLOR

3.

MARGIN WIDTH

HEX. NO./COLOR
NAME
PIXEL

Display the border around


IFRAME.
Set the border color.

4.

MARGIN HEIGHT PIXEL

5.
6.
7.

SCROLLING
NAME
NO RESIZE

YES, NO, AUTO


CHARECTORS
----------

8.

ALIGN

ABSOLUTE TOP, ABS


MIDDLE,
ABS BOTTOM, TOP,
BOTTOM, BASELINE,
TEXT TOP,
TEXT BOTTOM, LEFT,
RIGHT, MIDDLE.

Set the internal left and right


width of content.
Set the internal TOP and
BOTTOM width of content.
Set the scrolling.
Give name to the frame.
This attribute prevent the
user from resizing the frame
dynamically.
Align the IFRAME in page.

14) ANCHOR TAG


Anchor tag is used to navigate from 1 page to another page this can be
done using A. tag.
<A HREF=PATH> </A>
Without the anchor tag you are not able to connect with the next page
or any other page from your website. Because of this important feature anchor
tag become most important tag in HTML.
Syntax:
<A HREF=URL> NAME OF LINK </A>
Where in above syntax A represents the destination of the link and
HREF refers a HTML hipper reference.
Ie. The path of the file or the page which has to be get navigates.
Anchor tag keeps an unbreakable linkage among the web site and makes
user unable to maintain a flow of work.
<HTML>
<HEAD> ANCHORE TAG </HEAD>
<TITLE> TAG </TITLE>
<BODY>
<H2> LINK TO ANOTHER PAGE </H2>
<A HREF=PAGE2.HTML> PAGE 2 </A>
</BODY>
</HTML>

15) DIV TAG


This is one of the most used tags of HTML.

It creates the logical division of your web page. It simply avoids the
mixing of data with data properties with other data outside the division tag.
This division tag most frequently used with the style sheet for applying
that particular CSS to the required block of data.
Syntax:
<DIV> CODE OF PROGRAM </DIV>

2) DHTML
1) INTRODUCTION TO DHTML
<Dynamic Hipper Text Markup Language> DHTML is not a language it is
term for describing the art of making dynamic and interactive web pages. DHTML
combines HTML, JAVA SCRIPT, CSS, and DOM.
Because of DHTML the normal HTML will start support to 4 standards
and reach dynamic content, that are.
1) HTML support JAVA SCRIPT.
2) HTML support DOM.
3) HTML support EVENTS.
4) HTML support CASCADED STYLE SHEET (CSS).

1) CSS (CASCADED STYLE SHEET)

CSS is a web page layout method that has been added in HTML to give
web developers more control over their design their content and the layout of
page.
It is also helpful and necessary component for creating dynamic web
page.
Style sheet are a standard which is approved and recommended by W3C.
Use of CSS allows a designer to create a standard set of commands inside
the same page or outside the page. That set of commands control the design and
the style of support of your web page.

2) CREATING CSS
CSS has 3 types:
1) Inline CSS
2) Internal/ Embedded CSS
3) External CSS

1) CREATING INLINE CSS


We know we can use CSS by creating it in a page or outside a page. For
creating CSS inside a page we have to declare it inside the <HEAD> tag or in
<HTML> tag. We need to define the CSS along with <P> ____ </P> tag or <DIV>
______ </DIV> tag.
We have to format the block of data so this tag <P> and <DIV> tag are
used. So we can design the data of this tag insight the tag.
CSS has a huge range of attribute and they must be declared in a given
standard format only. The format is:

1) We must start declaration of CSS with the key name STYLE.


SYNTAX:<HTML>
<HEAD>
<P>
<STYLE =ATTRIBUTE 1: OPTION;
ATTRIBUTE 2: OPTION;
ATTRIBUTE N: OPTION>
FORMATED CANTENT;
</P>
</HEAD>
</HTML>

2) INTERNAL CSS
Internal CSS are defined between the head tag <HEAD> _____ < /HEAD>
Of the same HTML page where your HTML code is present.
Internal CSS placed in particular web page using STYLE tag.
<STYLE TYPE=TEXT/CSS>
_____________
</STYLE>

The attribute for designing the page where embedded in style tag
<STYLE> _______</STYLE>. So this CSS is also known as embedded CSS.
These styles can be use only for the web page in which they are
enclosed. There for you would need to update this CSS again and again for each

page. You wish to design for the advanced use of CSS you must take out internal
CSS. Outside the HTML page and use it as External CSS.
SYNTAX:<HEAD>
<STYLE TYPE = TEXT/CSS>
CONTENT, ATTRIBUTE, AND VALUES.
</STYLE>
</HEAD>

FOR EX:<HTML>
<HEAD>
<STYLE TYPE = TEXT/CSS>
H1 {COLOR: ORANGE; TEXT_ALIGN = CENTER; FONT_SIZE = 30 ;}
BODY {BACKGROUND COLOR = SKY BLUE ;}
P { FONT_FAMILY:TIMES NEW ROMAN; FONT_SIZE: 20; FONT_COLOR: RED ;}
</STYLE>
</HEAD>
<BODY>
<H1> THIS MY FIRST CSS PAGE. </H1>
<P> THIS IS LAST TYPE OF CSS. </CSS>
</BODY>

</HTML>

3) EXTERNAL CSS
It is basically a text file which contents the style data and which saved
with .css extension.
For ex. Prog.css
An external style sheet is a separate page or a file which latter linked to
the web page. There for the styles are external to that web page or it resizes out
of the page. So its called as external css.
This will allows you to reuse the styles as many times, simply we would
like to link already created css in the pages to would link to use.
For using the style sheet in required page. We have to link the css using
link attribute of HTML. Thus link must be given within the head tag.
<HEAD>
<LINK REL=STYLE SHEET TYPE=CSS/TEXT HREF=URL/PATH>
</HEAD>

NOTE One important feature of external css is it keeps your program


code clean and an ambiguous it means when you design your program using
many graphical and tabular way it takes so many attribute for the designing
purpose and if in that program code your style code will get mixed so there may
be possibility of confusion or there may be loss of program code by mistake.
While you try the smaller change in your file.
It is also helpful to reuse the external css for the deferent pages by
making little bit of change in style data.

Q) Create an external css for page having 1 paragraph with BGcolor= gray
and some text in paragraph with color green.

STYLE1.CSS =>
P.S {BGCOLOR: GRAY;
TEXT-COLOR: GREEN ;}

PROG.HTML =>
<HTML>
<HEAD>
<LINK REL=STYLE SHEET TYPE= CSS/TEXT HREF=STYLE1.CSS>
</HEAD>
<BODY>\
<P> THE COLLEGE CODE </P>
</BODY>
</HTML>

JAVA SCRIPT

1) INTRODUCTION
In the past HTML was only language and other can use and create web
page.
HTML is not a programming language it is a hipper text markup
language. Which can be by any one easily?
Still HTML has many limitations and as its a Text Markup language it
dont have security to the user data.
HTML can easily position a text and easily manage a graphics on a web
page. But it cannot interact with other pages efficiently as required.
As a time passes many of computer users are become dependent on the
graphical user interface. Ie. They click on button, selects item from list. They can
now see the menu and decides the option. They can insert values into text box
and take result instantly rather than the entering a commands or waiting for a
long time for desire output.

HTML can interact with pages very slowly due to a heavy and lengthy
code. So the web site developers become in need of light weight, easy, faster,
advance graphical and interactive language. From here JAVA script comes in
action.

2) JAVA SCRIPT
Java script was released by net scope navigator and sun micro system in
1995. However java script is not same thing as java.
Java script is not a standalone programming language like c, cpp, and
java. (It needs supports of some other language).
When java script was first developed its name was LIVE SCRIPT and its
developer was net scope only. But latter net scope collaborated. The live script
with sun micro system and rename it as a java script from live script.
But this was not renamed because of the similarity in nature but because
of the popularity of sun micro system. So there is no similarity between java and
java script.
So java script is not stand alone programming language it is a scripting
language and should be used with the HTML or java or any other supporting
elements.
Using java script with any other language can reduce the no of line of
code. And page becomes more light weight and it can work faster. This feature of
java script makes it popular in the developers world.

3) CHARECTERSTICS OF JAVA SCRIPT


1) Object based but not object oriented.
1) It means java script is based on object. It uses object with the system
evens and supportive HTML code and not totally depend on object.
2) Java script mostly works on built in object but sometimes you can also
create user defined object.

2) Java script is event driven


The old model for web page interaction was the procedural model or
sequential model. Ie. HTML code, but java script is based on event driven model
so java script not wait for developers instruction, whenever you click on an item
from the web page that time an click event comes in a action and java script
works on that event.
So java script is bonded with system events as same as event occurs code
related with that event will be executed by java script.
For ex. Get focus event of cursor.
3) Platform independent
Java script is mostly used with HTML code and they are design mainly to
use with HTML code only. So they are not bonded with any H/W platform rather
than they are bonded with web browser so they can run on any H/W platform
where browser is present. Java script uses event driven model it works on
common basic system events. That event occurs on every system similarly.
4) Quick development
Java script is not stand alone programming language so it doesnt require
time consuming code. So script can easily develop using inbuilt system object.
5) Easy to learn
Java script mainly handle the interaction between web page and all other
text and graphics is managed by HTML only so the developers need only scripting
knowledge and non technical HTML developer will develop the HTML code for
java script.

JAVA

JAVA SCRIPT

4) Writing Java Script into HTML


Java script syntax is embedded into on HTML file and interrupts HTML
tags.
Since all java script need to be included at an internal part of an HTML
document when required. The browser need to inform that specific code of HTML
is a java script.
When we inform to browser it will them use its built in java script engine
to interpret this code.
In HTML <script> -------------- </script>
Tag is used to initialize the java script. It used the information the browser that
java script included in a code.
Any programming language required variable creation assignment,
creation of constraints, creation of function, object and there values.
All the programming techniques can be used in java script, any
programming language need to be declare the programming variable at the
starting of program.
In HTML the head tag is best place for declaration of variable.
<Head> tag always process before the body of HTML program. All they
require content and variable and letters should be define in <head> tag only.
SYNTAX:<HEAD>
<SCRIPT LANGUAGE = JAVA SCRIPT>
JAVA SCRIPT CODE HERE.
</SCRIPT>
</HEAD>

4) DATA TYPES AND LATTERS


JAVA script supports for primitive types of data types and supports
complex data type such as arrays, objet, and also supports function.
Primitive type of data declare once cannot change their basic values
throughout the program.

1) Numbers
Java script consist
a) Integers,
b) Float.
These two types of numerical data type. Integer numbers can be defined
in java script in the form of binary, octal, decimal and hexadecimal form.
Ex. A=10; b=003; c= 07f;
Integer data types also contain some not 0 numbers values (none) that
has special meaning and special values.
Floating point letters are used to represent the numbers that required
use of decimal points or very large or very small numbers that must be written
using exponential notation.
Floating point number must consist of a number either containing a
decimal point is on integer followed by exponent.
Ex. A=12.6; b= 54.6554; c= 315.3;

2) BOOLEAN
It consists of only two logical values. Have only true and false.
Java script automatically converts Boolean values true and false into 1
and 0. When we are used in numerical expression.

Ex. Name= male; name= female; result= false;

3) STRING
It consist of string values ie. Anything enclosed in a single or double cote
(-----------or ---------------).
Java script provides built in supports for stream.
A stream is sequence of 0 or more character that is enclosed by notation.
A string start with a single cote must be end with single cote only and
similarly for double cote.
Ex. Sagar; 24, bajajnagar; Aurangabad;

4) NULL
It consist of only single value ie. NULL and used for empty or nonexistence reference. Use of NULL value refers the sort of error that occurs from
un-initialized variable.
We cannot convert a NULL value into default or dynamic value while
using in java script.
Ex. A=NULL.

5) TYPE CASTING
In the java script variable are loosely banded and are just implicitly
define best on the programming concept so we can change their data type in the
program dynamically using type cast.

5) CREATING VARIABLE
Variable are created for the handling various types of the data in the
programming environment.

Creating or declaring variable will help to keep the track of that variable
and it also defines the scope of that variable and keep your program code
organized.
SYNTAX:VAR<VARIABLE NAME> = VALUE;
EX.
VAR first name=Sagar;
VAR last-named=Maher;
VAR Phno=123456789;
6) OPERATORS AND EXPRESIONS IN JAVA SCRIPT
Operators are used to transform one or more values into a single
resultant value.

1) ARITHMATIC OPERATORS
OPERATOR
+
*
%
-/
++

DESCRIPTION
USE TO ADD TWO OR MORE NO.
TO MULTIPLY TWO OR MORE NO.
MODULUS.
RETURN THE VALUE THEN DECREMENT.
SUBSTRACTION.
DIVISION.
RETURN THE VALUE THEN INCREMENT.

An operator requiring single operant is refers as unary operator.


Ex. (--) and (++).
And the operator requiring two operand is known as binary operator.
Ex. +, /,*,-;

2) LOGICAL OPERATOR
Is used to perform Boolean operation on Boolean operand. AND, OR,
NOT are the logical operator supported by java script.
OPERATOR
&&
||
!

DESCRIPTION
LOGICAL AND
LOGICAL OR
LOGICAL NOT

EXAMPLE
A && B;
A || B;
!B;

3) COMPARISION OPERATOR
Are used to compare two values.
OPERATOR
==
!=
<
>
===
<=

DESCRIPTION
ITS COMPAIRE TWO VALUES ARE
EQUAL.
ITS COMPAIRE NOT EQUAL.
ONE VALUE IS LESS THAN SECOND.
ONE VALUE IS GREATER THAN SECOND.
STRICTLY EQUAL.
LESS THAN EQUAL.

4) STRING OPERATOR
This operator is used to combine two strings. This means that operands
of this operator are two strings and result of the string operator are
concatenation of two string operator in one string.
Ex. sag+ar; =Sagar.

7) Conditional Statement In Java Script

1) Immediate IF
This is inline conditional expression use to compare the condition with
the 2 expression True or False.
It douse not required IF keyword we can directly define our condition
and 2 expression which of them. Expression 1 is True and expression 2 is False
expression.
Syntax: (Condition)? Expression 1: Expression 2;

Ex.
Var day=Sunday;
(day==Sunday)? (This is weekend): (This is not weekend);

2) Simple IF
It will execute the body of IF statement only and only when the given
condition is True.
Syntax:
IF (Condition)
{
Body of IF;
}

Ex.
Var day=Tuesday;

IF (day==Tuesday)
{
Document.write (the day is right.);
}

3) IF then ELSE
It will execute the body of IF statement only when the condition is True If
the condition is False it will execute the body of ELSE statement.
Syntax:
IF (condition)
{
Body of IF;
}
Else
{
Body of Else;
}

Ex.
Var day=Monday;
IF (day==Monday)
{
Document.write (the current day);
}
Else

{
Document.write (Next Day);
}

4) LOOPS In Java Script


1) FOR Loop
It is most basic type of loop in any programming language.
In the For Loop there are 3 expression and body of For loop. Expression 1
assigns the initial value to the variable.
Expression 2 specifies the condition for the final value of Loop.
Expression 3 decides the initial value is to increment or decrement.
Syntax:
FOR (Expression 1; Expression 2; Expression 3)
{
Java script code;
}

Ex.
Var num;
For (num=0; num<10; num++)
{
Document.write (num);
}

2) While loop
This is also providing similar facility like FOR loop but it works on Boolean
operator True or False. It will repeat the block of while statement only when up to
the given condition gets True.
As long as condition get False the repetitions of block is in stop.
Syntax:
While (Condition)
{
Body of while;
}
Ex. Var num=1;
While (num<=10)
{
Document.write (num);
Num++;
}

3) Function
Syntax:
Function (Function name) (List of parameters)
{
Body of Function;
}

Functions are the block of code that perform specific task and also return
a value. If define as to be return.
Function content 0 or more parameters using this parameters we can
pass a values. Function process on this value and return a result to the user. There
are 2 type of function in java script.
1) Inbuilt.
2) User defines.
Function define by user is known as user define function. Function must
be declared in HEAD tag.
Ex.
Function mul (a, b)
{
Parseint (a);
Parseint (b);
Return a*b;
Document.write (mul);
}

4) Dialog Boxes In Java Script


Java script provides a facility to pick up the user input or display small
amount of text to the user. By using special self appears and separate Box known
as dialog Box.
There are 3 types of dialog box.
1) Alert
Simplest way to direct the small amount of text o/p to the user. Java
script inbuilt method alert use to initiate alert dialog box.

This method takes a string as an I/P argument and alert dialog box in the
browser window along with given string only when that specify event occurs.
Alert dialog box show OK button with the string and you can continue to
next process until you click on OK button.
We can show alert dialog box in following condition.
1) When incorrect instruction given by user.
2) Wrong calculation or invalid I/P.
3) Service expiry date warning.
4) Unauthorized activity done.
Syntax:
Alert (Message to be given.);

Ex.
Alert (Welcome in Coding Visions.);

2) prompt
Syntax: prompt (Message,Default);
Ex.
Prompt (Enter login name, CV);
Prompt (Enter the password, Coding);

3) Confirm
Syntax: confirm (Message);
Ex.
Confirm (logout);

3) FORM
Syntax:
<form>
Java script and HTML code;
</form>

1) Methods
HTML form has 2 methods which defines the transaction of data
between the browser to server.

1) Get
When you define method is Get. The form submission values are passed
to the server or any other back end by using the address bar.
Get method is uses the URL from the action tag which is the address of
server to pass the data specified location.

2) Post
When we use method= post.
The specified information or data is send to backend along with program
code using navigator object and it is not visible to the user.

2) Form object/ Elements.


1) Input Element

The most important element of HTML Form is I/P element. It is use to


select the information or I/P from the user.
I/P element define the type of I/P as per user required.
1) Text Box
Ex.
<Input type=text value=name> <br>
<Input type=text value= Rollo>

<Input type= text> defines the text field on the user Form which is use
to take the I/P from user in the normal text format and pass into server.

2) Password field
<Input type=password value=password>
<Input type=password> defines the similar text box as text field but
the character is in password field are masked.

3) Radio Button
<Input type=Radio value=male> <br>
<Input type=Radio value=Gmail>
When we define I/P type=Radio. We see the option of define
parameter from the code and we can select only one among them Radio Button
Works on Boolean property.

4) Check Boxes
<Input type=Check Box value=Bsc> <br>
<Input type= Check Box value=BCA>

5) Submit
<Input type=Submit Value=OK>

6) Select
<Input type=Select value=Field>
<Option>BCA</Option>
<Option>BSC</Option>
<Option>BCS</Option>

7) Text Area
<Text Area row=5 Cols=20>

8) Reset
<Input type=Reset value=Clear>

For Ex.
<html>
<head>
<script language="JavaScript">
function che ()
{
if (form1.nm.value=="")
{

alert ("Name should Not empty. ");


}
}
</script>
</head>
<body BGcolor="sky-blue">
<b>
<form name="form1" method="post" action="">
<table>
<tr><td>
Name :< /td><td><input type="text" name="nm" onclick="che ()"/>
</td></tr>
<tr><td>
Address :< /td><td><input type="text" text area="50" rows=5 cols=10
name="add"> </text area>
</td></tr>
<tr><td>
Age :< /td><td><input type="text" name="age" size="5"/>
</td></tr>
<tr><td>
<input type="submit" value="Send"/> &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp;
<input type="reset" value="Clear"/>
</td></tr>
</table>
</form>

</b>
</body>
</html>

You might also like