JavaScript

Wha’ ?
• JavaScript
• Scripting language of
the Web
Why
..?
• 1. HTML – Define
CONTENT of WP
• 2. CSS – Specify LAYOUT of
WP
• 3. JS – Specify the
BEHAVIOR of WP
Who
gives ?!
• YOU should!
• This single language forms
the basis for various other
languages – AJAX, JSON for
eg!

Speaking in English
Extremely
popular &
widespread
Scripting
Lang. for PC
Primarily
used for
Client-side
Scripting
Highly
used in
Web
Browsers

JS
• Built by Brendan Eich of Mozilla fame.
• Though originally called “Mocha”, it was shipped
as JavaScript when deployed on NetScape.
• It is a cross-platform, OO scripting language.
• Enable dynamic WPs through user interaction
and on-screen special effects.
• Provides Server-Side (MongoDB/Node.js) &
Client-Side Scripting (rollover, alert)
• P.S. NOT THE SAME AS JAVA!

Types of JS
Types of JS
Client Side
Scripting
Supplies objects to
control the browser
& its DOM
Allow apps to place
elements on HTML
form & respond to
user events
Server Side
Scripting
Allow app to
communicate with RDB
or perform file
manipulation on server.
Share info across users
of an app or connect
with other apps using
LiveConnect & Java.

JS Tags Description
<script> & </script> Only JS statements b/w these tags
<script src=“myScript.js”></script> Using/Importing external JS files
var price = 10 || var name=“Smith” Declare variables using keyword ‘ var ‘
alert(“msg”) || confirm(“msg”) ||
prompt(“msg”)
Inbuilt functions in JS
function showAlert(“msg”)
{
alert(“msg")
}
User defined functions in JS
objName || objName.propName ||
objName.methodName()
Refer to an object, property of obj & method
of obj respectively
Math – provides for math calculations
Date – provides date & time info
String – provides for string manipulation
Some of the built-in language objects of JS

Document Object
• The Document object represents the Web page
that is loaded in the browser window, and the
content displayed on that page, including text
and form elements.
• Document Methods
– You can use the methods of the document object to
work on a Web page.
– Here are the most common document methods:
• • write() - write a string to the Web page
• • open() - opens a new document
• • close() - closes the document

Formatting What is Written
• Document Properties
– • bgColor
– • fgColor
– • linkColor
– • vlinkColor
– • title
– • lastModified

DOM formatted Example
<SCRIPT language="JavaScript">
function newPage() {
var userName = prompt("Please enter your name:","")
document.write("<H1>Welcome " + userName +
"</H1><BR>")
document.write("<H2>to your new home page.</H2>")
}
</SCRIPT>

Window Object
• The window object represents the browser window.
• There are only two main window properties. They are:
– • status - set the status bar message
– • self - stores the name mof the current window
• Window Methods
• The window methods are mainly for opening and closing new
windows.
• The following are the main window methods. They are:
– • alert() - to display a message box
– • confirm() - to display a confirmation box
– • prompt() - to display a prompt box
– • open() - to open a new window
– • close() - to close a window

Window Attributes
• If the default new window does not suit your needs,
you can specify different features of the window when
you open it. The complete syntax of the
"window.open" is as follow:
– window.open(URL, windowName, featureList)
• By default, if you do not specify any features, then a
window will have all of them. The following are the
window attributes:
– • toolbar
– • menubar
– • scrollbars
– • resizeable
– • status
– • location
– • directories

Events
• some of the most common events:
– • onLoad - occurs when a page loads in a browser
– • onUnload - occurs just before the user exits a
page
– • onMouseOver - occurs when you point to an
object
– • onMouseOut - occurs when you point away
from an object
– • onSubmit - occurs when you submit a form
– • onClick - occurs when an object is clicked

JavaScript

More Related Content

JavaScript

Editor's Notes