www.sakshieducation.
com
Introduction to Java Scripts
What is JavaScript
ed
uc
at
io
n.
JavaScript is a scripting programming language.
co
m
JavaScript Origins
JavaScript was invented by Netscape and Sun
Microsystems in 1995. JavaScript and Java both are
different.
JavaScript is object-based programming language.
JavaScript is an interpreted language
JavaScript is accessible to the beginner.
Uses of JavaScript
hi
Use it to include sight and sound components with Javascript. Can
show, conceal, change, resize pictures, and make picture rollovers.
You can make scrolling content over the status bar.
.s
a
ks
Make pages progressively based on the client's decisions, the date,
or other outer information. It also can create pages that are redone
to the client.
Interact with the client it can do some preparing of structures and
can approve client information when the client submits the form.
w
w
How to Write JavaScript
Javascript code is regularly implanted in the HTML, to be deciphered
and run by the customer's program. Here are a few tips to recollect when
composing Javascript charges
Javascript code is case sensitive
White space in the middle of words and tabs are overlooked
Line breaks are overlooked aside from inside an statement
Javascript statements end with a semi- colon ;
www.sakshieducation.com
www.sakshieducation.com
SCRIPT Tag
The <script> label alarms a program that Javascript code takes
after. It is ordinarily inserted in the HTML
</SCRIPT>
ed
uc
at
io
n.
SCRIPT Example
Create index.html page
Write the below example code
co
m
<SCRIPT language = "JavaScript">
JavaScript code
<SCRIPT language = "JavaScript">
alert("My first java script program");
</SCRIPT>
w
w
.s
a
ks
hi
Save that html file
Open that file with browser
The output of the html file is
www.sakshieducation.com
www.sakshieducation.com
Executing Javascript
There are three ways to add JavaScript commands to your Web Pages.
Embedding code
Inline code
External file
ed
uc
at
io
n.
co
m
Embedding code
You can insert Javascript in a HTML archive as articulations and
capacities inside a <script> tag, by detailing a document as the
Javascript source, by defining a Javascript interpretation as the
estimation of a HTML property or as occasion handlers inside certain
other HTML labels.
Embedding Example
Create index.html page
Write the below example code
<SCRIPT language = "JavaScript">
alert ("My first Embedding java script program");
</SCRIPT>
w
w
.s
a
ks
hi
Save that html file
Open that file with browser
The output of the html file is
www.sakshieducation.com
www.sakshieducation.com
first
Inline
java
script
.s
a
ks
hi
ed
uc
at
io
n.
Inline Example
Create index.html page
Write the below example code
<button onclick= "alert ('My
program')">Click</button>
Save that html file
Open that file with browser
The output of the html file is
co
m
Inline code
You can insert Javascript in a HTML archive as articulations and
capacities inside any tag, by detailing an event i.e. onclick and
ondblclick.
w
w
External File
You can utilize the SRC characteristic of the <script> tag to call
Javascript code from an outside content record. This is helpful in the
event that you have a great deal of code or you need to run it from a few
pages, in light of the fact that any number of pages can call the same
outside Javascript document. The content document itself contains no
HTML labels. It is called by the following tag:
www.sakshieducation.com
www.sakshieducation.com
<SCRIPT SRC="script.js" language = "JavaScript"></SCRIPT>
Or
<SCRIPT SRC="script.js" language = "JavaScript" />
ed
uc
at
io
n.
co
m
External Example
Create index.html page
Write the below example code
<SCRIPT SRC="script.js" language = "JavaScript"></SCRIPT>
Save that html file
Inside the script.js file is
alert("My first External java script program");
w
w
.s
a
ks
hi
Open that file with browser
The output of the html file is
Objects in Java Script
Javascript programming deals with objects. Objects are a method
for sorting out the variables. The diverse screen components, for
example: Web pages, forms, text boxes, pictures, and buttons are dealt
with as objects
www.sakshieducation.com
www.sakshieducation.com
Methods and Properties
co
m
Every object has its own properties and methods.
Methods are the activities that the object can perform or that can
be performed on the object.
Examples: confirm, alert, write, open, and close
Properties define the characteristics of an object.
Examples: length, colour, name, height, width
Naming Objects
ed
uc
at
io
n.
Objects are organized in a hierarchy. To refer to an object use :
objectName
To refer to a property of an object use:
objectName.propertyName
To refer to a method of an object use:
objectName.methodName()
hi
Built-In Objects
A portion of the built-in language objects of Javascript offer more
advanced operations, for example:
Math provides for math calculations
Date provides date and time information
String provides for string manipulation
.s
a
ks
Math Object
The Math object gives methods to numerous numerical calculations,
including
Eg: abs(), log(), pow(), random(), round(), sqrt()
Syntax: math.method(#)
Example
w
w
<SCRIPT language = "JavaScript">
var num = 123.45
roundNum = Math.round(num)
alert(roundNum);
</SCRIPT>
www.sakshieducation.com
www.sakshieducation.com
ed
uc
at
io
n.
co
m
Output
Date Object
The Date object provides the day, date, and time information.
Syntax: dateObject.method(#)
hi
Example
<SCRIPT language="javascript">
ks
var year = new Date()
presentYear = year.getFullYear()
.s
a
alert(presentYear);
w
w
</SCRIPT>
www.sakshieducation.com
www.sakshieducation.com
ed
uc
at
io
n.
co
m
Output
String Object
The String object provides methods and properties for string
manipulation and formatting
Syntax: stringName.method(#)
ks
hi
Example
<SCRIPT language="javascript">
var theString = "Hello Sakshi"
.s
a
var printString = theString.bold()
var numChars = theString.length
w
w
alert("'"+printString+"' length is: "+numChars);
</SCRIPT>
www.sakshieducation.com
www.sakshieducation.com
ed
uc
at
io
n.
co
m
Output
<body>
ks
Example1
<html>
hi
Dynamic HTML with Java Script
DHTML stands for Dynamic HTML. It is not a new language, it is a
combination of HTML, Java Script and CSS. DHTML is mainly for the
dynamic web pages.
.s
a
<p onclick="this.style.fontSize='60px'">Click me to increase font
size</p>
</body>
w
w
</html>
Output
Before click
www.sakshieducation.com
ed
uc
at
io
n.
co
m
www.sakshieducation.com
w
w
.s
a
ks
hi
After click
www.sakshieducation.com
www.sakshieducation.com
Example2
<html>
<body>
<p onclick="this.style.color='green'">Click me to change color</p>
co
m
</body>
</html>
w
w
.s
a
ks
hi
ed
uc
at
io
n.
Output
Before click
www.sakshieducation.com
www.sakshieducation.com
w
w
.s
a
ks
hi
ed
uc
at
io
n.
co
m
After
click
www.sakshieducation.com
