![Page 1: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/1.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
JavaScript Fundamentals
![Page 2: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/2.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 1:Introduction to JavaScript
![Page 3: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/3.jpg)
Objectives
• Describe the origins of JavaScript• List the key JavaScript characteristics• Describe the differences between Java and
JavaScript• Discern among JavaScript, JScript and
VBScript• Differentiate between server-side and client-
side JavaScript applications• Embed JavaScript into HTML• Use the JavaScript comment tags
![Page 4: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/4.jpg)
Origins of JavaScript
• Developed by Netscape Corporation• Previously named LiveScript• First supported in Navigator v2.0
– Has since gained universal support
![Page 5: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/5.jpg)
JavaScript Characteristics
• A scripting language• Object-based, not object-oriented• Event-driven• Platform-independent• Enables quick development• Relatively easy to learn
![Page 6: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/6.jpg)
JavaScript and Common Programming Concepts
• Objects• Properties• Methods
![Page 7: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/7.jpg)
Java and JavaScript
• JavaScript and VBScript• Visual Basic and VBScript• JavaScript, JScript and ECMA Script
![Page 8: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/8.jpg)
Comparing Java to JavaScript
Java JavaScript
![Page 9: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/9.jpg)
Server-Side vs. Client-Side Applications
• Server-side applications– LiveWire
• Client-side applications– Embedding JavaScript into HTML– External scripts
![Page 10: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/10.jpg)
Annotating Your Code with Comments
• Single-line comment indicator• Multiple-line comment indicator
![Page 11: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/11.jpg)
Summary
Describe the origins of JavaScript List the key JavaScript characteristics Describe the differences between Java and
JavaScript Discern among JavaScript, JScript and
VBScript Differentiate between server-side and client-
side JavaScript applications Embed JavaScript into HTML Use the JavaScript comment tags
![Page 12: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/12.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 2:Working with Variables and Data in JavaScript
![Page 13: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/13.jpg)
Objectives
• Communicate with the user throughalert(), prompt() and confirm()
• Define variables and data types• Obtain user input and store it in variables• Report variable text to the client window• Discern between concatenation and addition• Use expressions and operators• Define inline scripting
![Page 14: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/14.jpg)
Using JavaScript toCommunicate with the User
• Giving the user a message: the alert() method
• Using semicolons in JavaScript• Getting data from the user: the prompt()
method• Concatenation• Requesting confirmation: the confirm()
method• Writing HTML dynamically: the document.write() method
![Page 15: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/15.jpg)
Using Data More Than Once: Variables
• What is a variable?• Variable data types• Literals• Naming variables• Declaring variables• Concatenating variables• Working with variables
![Page 16: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/16.jpg)
JavaScriptExpressions
• Assignment• Arithmetic• String• Logical
![Page 17: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/17.jpg)
Operators
• Used in expressions to store or return a value• Varieties include:
– Assignment– Arithmetic– Unary– Logical
![Page 18: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/18.jpg)
Inline Scripting and Simple User Events
• Event handlers– User-generated events are not script-driven
event handlers
![Page 19: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/19.jpg)
The onLoad and onUnload Event Handlers
• onUnload event handler is used to process, or handle, the unload event
• onLoad event handler is used by scripts that run as the page is loaded in the browser
![Page 20: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/20.jpg)
Keywords andReserved Words
• JavaScript keywords• JavaScript reserved words
![Page 21: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/21.jpg)
Summary
Communicate with the user throughalert(), prompt() and confirm()
Define variables and data types Obtain user input and store it in variables Report variable text to the client window Discern between concatenation and addition Use expressions and operators Define inline scripting
![Page 22: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/22.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 3:Functions, Methods
and Events in JavaScript
![Page 23: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/23.jpg)
Objectives
• Use methods as functions• Define and call functions• Use conversion methods• Pass arguments to and return values from
functions• Define operator precedence• Discern between global and local variables• Employ the conditional operator• Identify user events and event handlers
![Page 24: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/24.jpg)
Functions
• Organized blocks of code that handle actions generated by user events
• Can improve program efficiency and readability
![Page 25: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/25.jpg)
Methods as Functions
• Methods and functions are interchangeable in JavaScript– Any method that returns a value can be
called a function
![Page 26: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/26.jpg)
Defining a Function
• Calling statements• Arguments• Inserting functions into HTML pages• Using built-in functions• Good coding practice
![Page 27: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/27.jpg)
Calling a Function
• Passing arguments to functions• Returning values from functions• Operator precedence• Global versus local variables
![Page 28: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/28.jpg)
User Events and JavaScript Event Handlers
• User events– blur– click– change– focus– load– mouseOver– mouseOut– select
• Event handlers– button– reset– submit– radio– checkbox– link– form– text– textarea– select– image– area– window
![Page 29: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/29.jpg)
Summary
Use methods as functions Define and call functions Use conversion methods Pass arguments to and return values from
functions Define operator precedence Discern between global and local variables Employ the conditional operator Identify user events and event handlers
![Page 30: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/30.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 4:Controlling Program
Flow in JavaScript
![Page 31: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/31.jpg)
Objectives
• Use the if. . . statement• Use the while. . . statement• Use the for. . . statement• Use the break and continue statements• Define the do. . .while statement• Use the switch. . . statement
![Page 32: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/32.jpg)
The if. . . else Statement
• A single condition• Multiple conditions• Using if for conditional program flow
![Page 33: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/33.jpg)
The while Statement
• Used to execute a code group for as long as (while) a certain condition is true
![Page 34: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/34.jpg)
The for Statement
• A loop that can be used to execute a group of statements repeatedly
![Page 35: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/35.jpg)
The break Statement
• Used to exit a loop that otherwise would continue executing
![Page 36: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/36.jpg)
The continue Statement
• Used to force the flow of control back to the top of the loop
![Page 37: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/37.jpg)
The switch Statement
• Compares a value against other values• Functions the same as multiple if statements
![Page 38: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/38.jpg)
The do. . . while Statement
• Operates exactly like the while statement, with one key difference:– The do. . . while statement does not
check the conditional expression until after the first time through the loop
![Page 39: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/39.jpg)
Summary
Use the if. . . statement Use the while. . . statement Use the for. . . statement Use the break and continue statements Define the do. . .while statement Use the switch. . . statement
![Page 40: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/40.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 5:The JavaScript Object Model
![Page 41: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/41.jpg)
Objectives
• Describe the JavaScript object model• Use the window object• Manipulate properties and methods of the document object
• Use the with statement• Deploy the image, navigator and history
objects• Evaluate and change URL information with the location object
![Page 42: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/42.jpg)
The JavaScriptObject Model
• Browser objects• Language objects• Form field objects• Document Object Model (DOM)• Containership
![Page 43: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/43.jpg)
The window Object
• The highest-level object in the JavaScript object hierarchy
• Opening additional windows• Dot notation revisited• The status property• The onMouseOver and onMouseOut event
handlers
![Page 44: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/44.jpg)
The document Object
• Subordinate to the window object in the window hierarchy
• Defined when the <BODY> tag is evaluated in an HTML page
![Page 45: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/45.jpg)
The with Statement
• Says that for the body of the statements, any references that follow refer to the same object
![Page 46: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/46.jpg)
The image object
• Allows you to manipulate images in Internet Explorer 4.0 and Netscape Navigator 3.0 and later
• JavaScript and image maps
![Page 47: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/47.jpg)
The history Object
• Subordinate to the window object in the window hierarchy
![Page 48: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/48.jpg)
The location Object
• Subordinate to the window object in the window hierarchy
• Allows you to specify URLs in a script
![Page 49: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/49.jpg)
Thenavigator Object
• Reflects information about the browser being used
![Page 50: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/50.jpg)
Summary
Describe the JavaScript object model Use the window object Manipulate properties and methods of the document object
Use the with statement Deploy the image, navigator and history
objects Evaluate and change URL information with the location object
![Page 51: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/51.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 6:JavaScript
Language Objects
![Page 52: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/52.jpg)
Objectives
• Use the String object to test user input• Identify basic regular expressions and the RegExp object
• Deploy the Array object to create more efficient code
• Identify uses for the Date and Math objects
![Page 53: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/53.jpg)
JavaScript Language Objects
• String object• Math object• Array object• Date objects
![Page 54: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/54.jpg)
The string Object
• String object formatting methods• String object special characters• Additional String object methods
![Page 55: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/55.jpg)
Evaluating Strings
• The length property• The indexOf() and lastindexOf() methods• The substring() method• The charAt() method• Form validation using string methods
![Page 56: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/56.jpg)
The Array Object
• The Array object length property• Instances
![Page 57: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/57.jpg)
The Date Object
• Based on arrays• The only way to use date and time information
in JavaScript
![Page 58: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/58.jpg)
Setting and Extracting Time Information
• Follows the same procedures as setting and extracting date information
![Page 59: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/59.jpg)
The Math Object
• Contains properties and methods that aid in the creation of advanced mathematical calculations
![Page 60: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/60.jpg)
Summary
Use the String object to test user input Identify basic regular expressions and the RegExp object
Deploy the Array object to create more efficient code
Identify uses for the Date and Math objects
![Page 61: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/61.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 7:Developing Interactive Forms with JavaScript
![Page 62: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/62.jpg)
Objectives
• Identify and use form controls• Refer to and define form objects• Use the button object• Use the checkbox object• Evaluate text in the text and textarea
objects• Process radio object options• Capture choices from a select list
![Page 63: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/63.jpg)
Overview of Form Elements
• button• checkbox• hidden• password• radio
• reset• select• submit• text• textarea
![Page 64: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/64.jpg)
Referring to a Form Element
• Two ways– By name– By index number in the form object’s elements array
![Page 65: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/65.jpg)
Theform Object
• Represents an HTML form in JavaScript• <FORM> tags present in HTML document
![Page 66: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/66.jpg)
The button Object
• The simplest of all objects• Has only one event handler: onClick
![Page 67: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/67.jpg)
The checkbox Object
• A checkbox is an input object in the shape of a small square that can be checked on or off
![Page 68: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/68.jpg)
The text and textarea Objects
• Text objects can only display a single line of text
• Textarea objects can display multiple, scrolling lines of text
![Page 69: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/69.jpg)
The radio Object
• Used to select among mutually exclusive options
![Page 70: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/70.jpg)
The select Object
• A drop-down list or a list box of items used in an HTML form
• No methods are defined for the select object
![Page 71: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/71.jpg)
FormValidation
• Benefits– Increased validity of form submissions– Increased end-user satisfaction– Conservation of bandwidth
![Page 72: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/72.jpg)
Summary
Identify and use form controls Refer to and define form objects Use the button object Use the checkbox object Evaluate text in the text and textarea
objects Process radio object options Capture choices from a select list
![Page 73: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/73.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 8:Cookies and
JavaScript Security
![Page 74: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/74.jpg)
Objectives
• Explain cookies• Delete cookies from your disk• Assign a cookie• Test for the presence of a cookie• Clear a cookie• Enable and disable cookies in the browser• Use cookies and passwords to restrict entry to
a page
![Page 75: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/75.jpg)
What Are Cookies?
• Small memory-resident pieces of information sent from a server to your computer
• Often referred to as “persistent cookies” and “persistent HTML”
![Page 76: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/76.jpg)
How Are Cookies Sent?
• When a user generates an HTTP request, two actions can occur:– A server can deposit cookies on the user’s
hard drive– Any cookies already on the user’s system
that match the server’s domain can be passed along in the request header
![Page 77: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/77.jpg)
Who Can Send Cookies?
• A server can set, or deposit, a cookie only if a user visits that particular site– Cross-domain posting is impossible– Some domains “share” cookies
![Page 78: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/78.jpg)
Storing Cookies
• Cookies store name=value pairs as text strings
• Domains can store no more than 20 cookies on a user’s computer
• Users can delete cookie files
![Page 79: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/79.jpg)
Why Use Cookies?
• Authentication• Storing user information
– Operating system and browser type– Service provider– IP address– History of sites visited
• State maintenance with cookies
![Page 80: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/80.jpg)
Testing for Cookie Presence
• You can easily test for the presence of any cookie by using “document.cookie” in your script
![Page 81: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/81.jpg)
Clearing a Cookie
• To clear a cookie, reassign it, adding an expiration date that has already passed
![Page 82: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/82.jpg)
Controlling Cookies in the Browser
• Netscape Navigator• Microsoft Internet Explorer
![Page 83: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/83.jpg)
JavaScript Security Issues
• JavaScript and helper application programs• Malicious and accidental coding• Previous browser versions and security• Signed scripts
– Digital certificates
![Page 84: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/84.jpg)
Summary
Explain cookies Delete cookies from your disk Assign a cookie Test for the presence of a cookie Clear a cookie Enable and disable cookies in the browser Use cookies and passwords to restrict entry to
a page
![Page 85: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/85.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 9:Controlling
Frames with JavaScript
![Page 86: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/86.jpg)
Objectives
• Target frames with JavaScript• Change two or more frames simultaneously• Use functions and variables within framesets• Use functions and variables with related
windows• Target the opener window
![Page 87: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/87.jpg)
Using JavaScriptwith Frames and Windows
• Understanding HTML frames• Understanding HTML targets
![Page 88: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/88.jpg)
Targeting Frames with JavaScript
• To target frames, use either of the following techniques– By target name– By number in the frames array
![Page 89: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/89.jpg)
Changing Two or More Frames with JavaScript
• To change two (or more) frames at once in a script, write a simple function that includes two (or more) location.href lines
![Page 90: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/90.jpg)
Frames, Functions and Variables
• Variables can be stored in any of the files involved in making a frameset
• Targeting windows– Targeting the “opener” window
![Page 91: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/91.jpg)
Targeting Windowswith JavaScript
• Targeting the opener window
![Page 92: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/92.jpg)
Summary
Target frames with JavaScript Change two or more frames simultaneously Use functions and variables within framesets Use functions and variables with related
windows Target the opener window
![Page 93: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/93.jpg)
Copyright © 2002 ProsoftTraining. All rights reserved.
Lesson 10:Custom
JavaScript Objects
![Page 94: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/94.jpg)
Objectives
• Create a custom JavaScript object• Define properties and methods of custom
objects• Create new object instances• Create client-side databases using custom
objects• Create functions and methods for
manipulating client-side databases
![Page 95: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/95.jpg)
Advantages of Custom Objects
• Creating a user-defined object offers two major advantages– You can create sophisticated solutions with
a minimum of coding– You can represent programming constructs
as objects
![Page 96: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/96.jpg)
Creating a JavaScript Object: The Constructor
• You define, or create, a custom JavaScript object with a special function called a constructor– The constructor defines the properties and
methods of your object
![Page 97: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/97.jpg)
Creating an Instance of a Custom Object
• To instantiate then populate the properties of each new instance with actual data, you must declare variables
![Page 98: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/98.jpg)
Creating Object Methods
• You can create as many methods for your object as you want
• Methods can be as simple or as sophisticated as you want
![Page 99: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/99.jpg)
Creating Functions for Your Objects
• When you need to evaluate multiple objects in an array, you need a function as opposed to a method
![Page 100: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/100.jpg)
Summary
Create a custom JavaScript object Define properties and methods of custom
objects Create new object instances Create client-side databases using custom
objects Create functions and methods for
manipulating client-side databases
![Page 101: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/101.jpg)
JavaScript Fundamentals
Introduction to JavaScript Working with Variables and Data in JavaScript Functions, Methods and Events in JavaScript Controlling Program Flow in JavaScript The JavaScript Object Model JavaScript Language Objects
![Page 102: Copyright © 2002 ProsoftTraining. All rights reserved. JavaScript Fundamentals](https://reader036.vdocument.in/reader036/viewer/2022070400/56649e725503460f94b70bbe/html5/thumbnails/102.jpg)
JavaScript Fundamentals
Developing Interactive Forms with JavaScript Cookies and JavaScript Security Controlling Frames with JavaScript Custom JavaScript Objects