Scribd
Upload
41 views

Introduction To Javascript

JavaScript is a scripting language used to add interactivity to HTML pages. It allows embedding code directly into HTML and is supported by all major browsers. JavaScript can be used to validate forms, detect browsers, create cookies, and more. It is an interpreted language that does not require compilation and can be used freely without licensing. Common JavaScript elements include variables, operators, functions, and the ability to modify the DOM tree and trigger events.

Uploaded by

Shan Anwer
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
41 views

Introduction To Javascript

JavaScript is a scripting language used to add interactivity to HTML pages. It allows embedding code directly into HTML and is supported by all major browsers. JavaScript can be used to validate forms, detect browsers, create cookies, and more. It is an interpreted language that does not require compilation and can be used freely without licensing. Common JavaScript elements include variables, operators, functions, and the ability to modify the DOM tree and trigger events.

Uploaded by

Shan Anwer
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 24

INTRODUCTION TO

JAVASCRIPT

JAVASCRIPT
JavaScript is used in millions of Web pages to
improve the design, validate forms, detect
browsers, create cookies, and much more.
JavaScript is the most popular scripting
language on the internet, and works in all
major browsers, such as Internet Explorer,
Mozilla, Firefox, Netscape, Opera.

WHAT IS JAVASCRIPT?
JavaScript was designed to add interactivity to HTML
pages
JavaScript is a scripting language (a scripting language is
a lightweight programming language)
A JavaScript consists of lines of executable computer
code
A JavaScript is usually embedded directly into HTML
pages
JavaScript is an interpreted language (means that scripts
execute without preliminary compilation)
Everyone can use JavaScript without purchasing a license

Are Java and JavaScript the Same?


NO!
Java and JavaScript are two completely
different languages in both concept and
design!
Java (developed by Sun Microsystems) is a
powerful and much more complex
programming language - in the same category
as C and C++.

How to Put a JavaScript Into an HTML


Page?
<html>
<body>
<script type="text/javascript">
document.write("Hello World!")
</script>
</body>
</html>

Ending Statements With a Semicolon?


With traditional programming languages, like
C++ and Java, each code statement has to end
with a semicolon (;).
Many programmers continue this habit when
writing JavaScript, but in general, semicolons
are optional! However, semicolons are
required if you want to put more than one
statement on a single line.

JavaScript Variables
Variables are used to store data.
A variable is a "container" for information you want
to store. A variable's value can change during the
script. You can refer to a variable by name to see its
value or to change its value.
Rules for variable names:
Variable names are case sensitive
They must begin with a letter or the underscore character
strname STRNAME (not same)

JavaScript Operators
Arithmetic Operators

Operator
+

Description

Example

Addition

x=2

Result
4

y=2
x+y
-

Subtraction

x=5

y=2
x-y
*

Multiplication

x=5

20

y=4
x*y
/

Division

15/5

5/2
%

++

Modulus (division
remainder)

Increment

2,5

5%2

10%8

10%2

x=5

x=6

x++
--

Decrement

x=5
x--

x=4

JavaScript Operators 2
Assignment Operators

Operator

Example

Is The Same As

x=y

x=y

+=

x+=y

x=x+y

-=

x-=y

x=x-y

*=

x*=y

x=x*y

/=

x/=y

x=x/y

%=

x%=y

x=x%y

JavaScript Operators - 3
Comparison Operators

Operator

Description

Example

==

is equal to

5==8 returns false

===

is equal to (checks for


both value and
type)

x=5
y="5"

x==y returns true


x===y returns
false
!=

is not equal

5!=8 returns true

>

is greater than

5>8 returns false

<

is less than

5<8 returns true

>=

is greater than or equal


to

5>=8 returns false

<=

is less than or equal to

5<=8 returns true

JavaScript Operators - 4
Logical Operators

Operator

Description

Example

&&

and

x=6
y=3

(x < 10 && y > 1)


returns true
||

or

x=6
y=3

(x==5 || y==5)
returns false
!

not

x=6
y=3

!(x==y) returns
true

JavaScript Basic Examples


<script>
document.write("Hello World!")
</script>
<script>
alert("Hello World!")
</script>

Example
<script>
x=Hello World!
document.write(x)
</script>

JavaScript Popup Boxes


Alert Box
An alert box is often used if you 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>

Start of the
function
Displays an alert
box
Calling the
function

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

Start of the
function
Prompt box
Calling the
function

Confirm Box
A confirm box is often used if you 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

User input

confirmatio
n

Not confirmed

DOM Document Object Modal


Once html element are rendered (painted) in
the browser window, browser can not
recognize them
To create interactive web pages it is vital that
the browser continues to recognize HTML
elements
JavaScript enabled browsers do this because
they recognize and uses DOM

20

DOM Document Object Modal


The HTML DOM defines a standard set of
objects for HTML, and a standard way to
access and manipulate HTML documents
All HTML elements, along with their
containing text and attributes, can be
accessed through the DOM
The contents can be modified or deleted, and new
elements can be created
21

The HTML DOM is platform and language


Independent
It can be used by any programming language like
Java, JavaScript, and VBScript

The HTML DOM can be thought of as a


hierarchy moving from the most general
object to the most specific

22

Window

Images[]
Array of
images

links[]
Array of
links

Element[ ]
Array of
element
of forms
Textboxes
buttons
select list
Reset
files

Forms[ ]
Array of
forms

Document

History

Location

anchors[]
Array of
anchors
Options[]
li

Navigator

23

document.forms[0].elements[0].value
document.images[0].src
document.links[0].href

You might also like