SlideShare a Scribd company logo
2
Most read
7
Most read
9
Most read
JavaScript
- Vidyut Singhania
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.
Components of JS
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
Advantages Disadvantages
JavaScript

More Related Content

PDF
Javascript essentials
PPTX
JavaScript New Tutorial Class XI and XII.pptx
PPT
JavaScript Tutorial
ODP
Datatype in JavaScript
PDF
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
PDF
javascript objects
PPTX
Java script
PDF
3. Java Script
Javascript essentials
JavaScript New Tutorial Class XI and XII.pptx
JavaScript Tutorial
Datatype in JavaScript
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
javascript objects
Java script
3. Java Script

What's hot (20)

PPTX
JavaScript Basic
PPT
Introduction to Javascript
PPTX
Angularjs PPT
PPTX
Lab #2: Introduction to Javascript
PPT
Javascript
PDF
Basics of JavaScript
PPT
JavaScript - An Introduction
PDF
PPTX
jQuery PPT
PPTX
Introducing type script
PDF
Introduction to HTML5
KEY
HTML CSS & Javascript
PDF
jQuery for beginners
PPTX
Javascript
PPTX
Java script
PDF
Javascript
PDF
Asp.Net Core MVC , Razor page , Entity Framework Core
PPT
TypeScript Presentation
PDF
ReactJS presentation
PDF
TypeScript Introduction
JavaScript Basic
Introduction to Javascript
Angularjs PPT
Lab #2: Introduction to Javascript
Javascript
Basics of JavaScript
JavaScript - An Introduction
jQuery PPT
Introducing type script
Introduction to HTML5
HTML CSS & Javascript
jQuery for beginners
Javascript
Java script
Javascript
Asp.Net Core MVC , Razor page , Entity Framework Core
TypeScript Presentation
ReactJS presentation
TypeScript Introduction
Ad

Similar to JavaScript (20)

PPT
Session vii(java scriptbasics)
PPTX
Javascript
PPT
Easy javascript
PPTX
javaScript and jQuery
PPT
Learn javascript easy steps
PPTX
Java Script basics and DOM
PDF
HSC INFORMATION TECHNOLOGY CHAPTER 3 ADVANCED JAVASCRIPT
PDF
CS8651- Unit 2 - JS.internet programming paper anna university -2017 regulation
PPT
13488117.ppt
PPT
13488117.ppt
PDF
22519 - Client-Side Scripting Language (CSS) chapter 1 notes .pdf
PPTX
Javascript
PPTX
Java script
PPTX
Java script introduction
PPT
Applied component i unit 2
PDF
Basic JavaScript Tutorial
PPT
INTRO TO JAVASCRIPT basic to adcance.ppt
PPTX
CSC PPT 12.pptx
DOC
2javascript web programming with JAVA script
PPTX
01 Introduction - JavaScript Development
Session vii(java scriptbasics)
Javascript
Easy javascript
javaScript and jQuery
Learn javascript easy steps
Java Script basics and DOM
HSC INFORMATION TECHNOLOGY CHAPTER 3 ADVANCED JAVASCRIPT
CS8651- Unit 2 - JS.internet programming paper anna university -2017 regulation
13488117.ppt
13488117.ppt
22519 - Client-Side Scripting Language (CSS) chapter 1 notes .pdf
Javascript
Java script
Java script introduction
Applied component i unit 2
Basic JavaScript Tutorial
INTRO TO JAVASCRIPT basic to adcance.ppt
CSC PPT 12.pptx
2javascript web programming with JAVA script
01 Introduction - JavaScript Development
Ad

Recently uploaded (20)

PPTX
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
PPT
“AI and Expert System Decision Support & Business Intelligence Systems”
PDF
Building Integrated photovoltaic BIPV_UPV.pdf
PDF
Modernizing your data center with Dell and AMD
PDF
CIFDAQ's Market Insight: SEC Turns Pro Crypto
PDF
Network Security Unit 5.pdf for BCA BBA.
PPTX
Big Data Technologies - Introduction.pptx
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PDF
KodekX | Application Modernization Development
PDF
Mobile App Security Testing_ A Comprehensive Guide.pdf
PDF
Review of recent advances in non-invasive hemoglobin estimation
DOCX
The AUB Centre for AI in Media Proposal.docx
PDF
Reach Out and Touch Someone: Haptics and Empathic Computing
PDF
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
PDF
Approach and Philosophy of On baking technology
PPTX
Digital-Transformation-Roadmap-for-Companies.pptx
PPTX
Understanding_Digital_Forensics_Presentation.pptx
PDF
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
PDF
Encapsulation theory and applications.pdf
PPTX
A Presentation on Artificial Intelligence
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
“AI and Expert System Decision Support & Business Intelligence Systems”
Building Integrated photovoltaic BIPV_UPV.pdf
Modernizing your data center with Dell and AMD
CIFDAQ's Market Insight: SEC Turns Pro Crypto
Network Security Unit 5.pdf for BCA BBA.
Big Data Technologies - Introduction.pptx
Per capita expenditure prediction using model stacking based on satellite ima...
KodekX | Application Modernization Development
Mobile App Security Testing_ A Comprehensive Guide.pdf
Review of recent advances in non-invasive hemoglobin estimation
The AUB Centre for AI in Media Proposal.docx
Reach Out and Touch Someone: Haptics and Empathic Computing
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
Approach and Philosophy of On baking technology
Digital-Transformation-Roadmap-for-Companies.pptx
Understanding_Digital_Forensics_Presentation.pptx
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
Encapsulation theory and applications.pdf
A Presentation on Artificial Intelligence

JavaScript

  • 2. 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!
  • 3. Speaking in English Extremely popular & widespread Scripting Lang. for PC Primarily used for Client-side Scripting Highly used in Web Browsers
  • 4. 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!
  • 5. 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.
  • 7. 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
  • 8. 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
  • 9. Formatting What is Written • Document Properties – • bgColor – • fgColor – • linkColor – • vlinkColor – • title – • lastModified
  • 10. 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>
  • 11. 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
  • 12. 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
  • 13. 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

Editor's Notes

  • #3: All modern HTML pages are using JavaScript