Java script

WHAT IS JAVASCRIPT?
• JavaScript is a scripting language (a scripting language is a lightweight
programming language)
• JavaScript was designed to add interactivity to HTML pages
• JavaScript is an interpreted language (means that scripts execute without
preliminary compilation)
• Everyone can use JavaScript without purchasing a license
• JavaScript is used in millions of Web pages to improve the design, validate
forms, detect browsers, create cookies, and much more.
• JavaScript works in all major browsers, such as Internet
Explorer, Mozilla, Firefox, Opera.

Where did it come from
• Originally called LiveScript at Netscape started out to be a server side
scripting language for providing database connectivity and dynamic HTML
generation on Netscape Web Servers.
• Netscape decided it would be a good thing for their browsers and servers
to speak the same language so it got included in Navigator.
• Netscape in alliance with Sun jointly announced the language and its new
name Java Script
• Because of rapid acceptance by the web community Microsoft forced to
include in IE Browser

Are Java and JavaScript the Same?

NO! Java and JavaScript are two completely different languages
in both concept and design!

• Java (developed by Sun • JavaScript (developed by
Microsystems) is a powerful and Netscape), is a smaller language
much more complex that does not create applets or
programming language - in the standalone applications. In its
same category as C and C++. most common form
• It can be used to create today, JavaScript resides inside
standalone applications and a HTML documents, and can
special type of mini provide levels of interactivity far
application, called an applet. beyond typically flat HTML pages

How to Put a JavaScript Into an
HTML Page?

We can add JavaScript in three ways in our
document:
1) Inline
<input type="button" id="hello-world2" value="Hello" onClick="alert('Hello World!');" />

2) Embedded
<script type="text/javascript">
function helloWorld() { alert('Hello World!') ; }
</script>

3) External
<head> <script type="text/javascript" language="javascript" src="hello.js"></script></head>

How to Put a JavaScript Into an HTML Page?

Ending Statements With a Semicolon?
<html>
• With traditional programming
<body>
languages, like C++ and Java, each code
<script type="text/javascript"> statement has to end with a semicolon
document.write("Hello World!"); (;).
</script> • Many programmers continue this habit
</body> when writing JavaScript, but in
</html> general, semicolons are optional!
However, semicolons are required if you
want to put more than one statement
on a single line.
NOTE: At times JavaScript is disabled in some browsers and it becomes difficult to get
appropriate behavior and the user get confused, so to avoid such conditions we should check if
it is enable or we should display an appropriate message. We can do this with the help of:
<noscript> <p>This will not be displayed if JavaScript is enabled</p> </noscript>

JavaScript Terminology

Objects: Properties:
• Almost everything in JavaScript • Properties are object attributes.
is an Object: String, Number, • Object properties are defined by
Array, Function.... using the object's name, a
• An object is just a special kind of period, and the property name.
data, with properties and • e.g., background color is
methods. expressed by:
• Objects have properties that act document.bgcolor
as modifiers. document is the object
.bgcolor is the property.
Eg: personObj=new Object();
personObj.firstname="John";
personObj.lastname="Doe";
personObj.age=50;
personObj.eyecolor="blue";

Methods: Events:
• Methods are actions applied to • Events associate an object with
particular objects. Methods are an action.
what objects can do. e.g., the onclick event handler
e.g., action can change an image.
document.write(”Hello e.g., the onSubmit event handler
World") sends a form.
document is the object. • User actions trigger events.
write is the method.

Functions: Values:
• Functions are named statements • Values are bits of information.
that performs tasks. • Values, types and some examples
e.g. function doWhatever() include:
{ Number: 1, 2, 3, etc.
statement here String: characters enclosed in quotes.
} Boolean: true or false.
The curly braces contain the Object: image, form
statements of the function. Function: validate, doWhatever
• JavaScript has built-in
functions, and we can write our
own.

Variables: Expressions :
• Variables contain values and use • Expressions are commands that
the equal sign to specify their assign values to variables.
value. • Expressions always use an
• Variables are created by assignment operator, such as
declaration using the var the equals sign.
command with or without an e.g., var month = May; is an
initial value state. expression.
e.g. var month;
• Expressions end with a
e.g. var month = April; semicolon.

Operators:
• Operators are used to handle variables.
Types of operators with examples:
Arithmetic operators, such as plus(+).
Comparisons operators, such as equals(==).
Logical operators, such as AND.
Assignment like (=).
+ Operator: The + operator can also be used to add string variables or text
values together.

Condition statements
• Very often when we write code, we want to perform different actions
for different decisions. we can use conditional statements in our code
to do this.

In JavaScript we have the following conditional statements:
• if statement - use this statement if we want to execute some code only
if a specified condition is true
• if...else statement - use this statement if we want to execute some
code if the condition is true and another code if the condition is false
• if...else if....else statement - use this statement if we want to select one
of many blocks of code to be executed
• switch statement - use this statement if we want to select one of many
blocks of code to be executed

Loops
JavaScript performs several types of repetitive operations, called "looping".
• for loop: The for loop is executed till a specified condition returns false
for (initialization; condition; increment)
{
// statements
}
• while loop: The while statement repeats a loop as long as a specified
condition evaluates to true.
while (condition)
{
// statements
}

Arrays
Arrays are usually a group of the same variable type that use an index number
to distinguish them from each other. Arrays are one way of keeping a program
more organized.

Creating arrays: Initializing an array:
• var badArray = new Array(10); • Var myArray= new Array(“January”,” February”,”
// Creates an empty Array that's sized March”);
for 10 elements. • var myArray = ['January', 'February', 'March'];
• var goodArray= [10]; document.write(myArray[0]);//output: January
//Creates an Array with 10 as the first document.write(myArray[1]);//output: February
element. document.write(myArray[2]);//output: March

JavaScript Popup Boxes
It is possible to make three different kinds of
popup boxes:
1) Alert Box
• An alert box is often used if we want to make sure information comes
through to the user.
• When an alert box pops up, the user will have to click "OK" to proceed.

<script>
alert("Hello World")
</script>

2) Confirm Box
• A confirm box is often used if we want the user to verify or accept
something.
• When a confirm box pops up, the user will have to click either "OK" or
"Cancel" to proceed.
• If the user clicks "OK", the box returns true. If the user clicks
"Cancel", the box returns false.

<script>
var r=confirm("Press a button!");
if (r==true)
document.write("You pressed OK!“);
else
document.write("You pressed Cancel!“);
</script>

3) Prompt Box
• A prompt box is often used if you want the user to input a value before
entering a page.
• When a prompt box pops up, the user will have to click either "OK" or
"Cancel" to proceed after entering an input value.
• If the user clicks "OK“, the box returns the input value. If the user clicks
"Cancel“, the box returns null.

<script>
x=prompt (“Please enter your name”, “sahil goel ”)
document.write(“Welcome <br>”+x)
</script>

DOM
• The Document Object Model (DOM) is the model that describes how all
elements in an HTML page, like input fields, images, paragraphs etc., are
related to the topmost structure: the document itself. By calling the
element by its proper DOM name, we can influence it.
• In DOM each object, whatever it may be exactly, is a Node.
Node object: We can traverse through different nodes with the help of certain
node properties and methods:
Eg: firstChild, lastChild, parentNode, nextSibling, previousSibling etc.
Document object:The Document object gives us access to the document's
data. Some document methods are:
Eg: getElementById(), getElementsByTagName() etc.

What is a Cookie?
A cookie is a small text file that JavaScript can use to store information about a user.
• There are two types of cookies:
– 1) Session Cookies
– 2) Persistent Cookies
Session Cookies :A browser stores session cookies in memory.
• Once a browser session ends, browser loses the contents of a session cookie.

–Persistent Cookies: Browsers store persistent cookies to a user’s hard
drive.
• We can use persistent cookies to get information about a user that we can use
when the user returns to a website at a later date.

More about Cookies
• JavaScript deals with cookies as objects.
• JavaScript works with cookies using the document.cookie
attribute.

Examples of cookie usage:
• User preferences
• Saving form data
• Tracking online shopping habits

Parts of a Cookie Object
• name – An identifier by which we reference a particular cookie.
• value – The information we wish to save, in reference to a particular
cookie.
• expires – A GMT-formatted date specifying the date (in milliseconds)
when a cookie will expire.
• path – Specifies the path of the web server in which the cookie is
valid. By default, set to the path of the page that set the cookie.
However, commonly specified to /, the root directory.
• domain – Specifies the domain for which the cookie is valid. Set, by
default, only to the full domain of a page..
• secure – Specifies that a web browser needs a secure HTTP
connection to access a cookie.

Setting a Cookie – General Form:
document.cookie = “cookieName = cookieValue;
expires = expireDate; path = pathName;
domain = domainName; secure”;

Escape Sequences:
• When we set cookie values, we must first convert the string values that
set a cookie so that the string doesn’t contain white space, commas or
semi-colons.
• We can use JavaScript’s intrinsic escape() function to convert white
space and punctuation with escape sequences.
• Conversely, we can use unescape() to view text encoded with
escape().

Cookie limitations:

• A given domain may only set 20 cookies per machine.
• A single browser may only store 300 cookies.
• Browsers limit a single cookie to 4KB.

Java script

More Related Content

What's hot (20)

Viewers also liked (6)

Similar to Java script (20)

More from Sukrit Gupta (8)

Recently uploaded (20)

Java script