1. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 1 Working with JavaScript Creating a Programmable Web Page for North Pole Novelties Tutorial 10

2. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 2 Objectives Introducing JavaScript Inserting JavaScript into a Web Page File Writing Output to the Web Page

3. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 3 Objectives Working with Variables and Data Working with Dates Working with Expressions and Operators Creating JavaScript Functions Creating the XmasDays Function

4. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 4 Objectives Working with Conditional Statements Using Arrays Working with Program Loops Debugging Your JavaScript Programs

5. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 5 Introduction to JavaScript Server-side Programs pose problems Client-side Programs were developed to run programs and scripts on the client side of a Web browser.

6. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 6 The Development of JavaScript JavaScript is a subset of Java. Differences between Java and JavaScript: –Java is a compiled language –JavaScript is an interpreted language

7. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 7 Comparing Java and JavaScript

8. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 8 The Development of JavaScript Jscript is a version of JavaScript supported by Internet Explorer. The European Computer Manufacturers Association (ECMA) develops scripting standards. –The standard is called ECMAScript but browsers still generally call is JavaScript.

9. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 9 Inserting JavaScript into a Web Page File Outline the main tasks you want the program to perform first. A JavaScript program can either be placed directly in a Web page file or saved in an external text file.

10. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 10 Inserting JavaScript into a Web Page File Insert a client-side script in a Web page when using the script element. Comments are useful for hiding scripts from older browsers. Specify alternative content using the nonscript element for browsers that don’t support scripts (or have their script support disabled).

11. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 11 Writing Output to the Web Page An object-oriented programming language writes the output by manipulating tasks. An action you perform on an object is called a method.

12. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 12 Working with Variables and Data A variable is a named item in a program that stores information. Variable names have restrictions (see pages HTML 531-532).

13. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 13 Working with Variables and Data JavaScript variable types: –Numeric variables –String variables –Boolean variables –Null variables You must declare a variable before using it.

14. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 14 Working with Variables and Data Numeric variable- any number, such as 13, 22.5, etc. –Can also be expressed in scientific notation. String variable- any group of text characters, such as “Hello” or “Happy Holidays!” –Must be enclosed within either double or single quotations (but not both). Boolean variable- accepts only true and false values Null variable- has no value at all.

15. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 15 Working with Dates Create a date object to store date information. Date Methods

16. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 16 Working with Expressions and Operators Expressions are JavaScript commands that assign values and variables. Operators are elements that perform actions within expressions. –Arithmetic operators: perform simple mathematical calculations –Binary operators: work on two elements in an expression –Unary operators: work on only one variable –Increment operators: can be used to increase the value of a variable by 1 –Assignment operators: used to assign values in expressions

17. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 17 Working with Expressions and Operators The Math object is a JavaScript object used for calculations other than simple math.

18. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 18 Creating JavaScript Functions A function is a series of commands that perform an action or calculates a value. A function name identifies a function. Parameters are values used by the function.

19. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 19 Working with Conditional Statements Conditional statements are commands that run only when specific conditions are met. Conditional statements require a Boolean expression. –you need one of the following operators to create a Boolean expression: Comparison operator Logical operator Conditional operator

20. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 20 Using Arrays An array is an ordered collection of values referenced by a single variable name. var variable = new Array (size); Where variable is the name of the array variable and size is the number of elements in the array.

21. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 21 Working with Program Loops A program loop is a set of instructions that is executed repeatedly. –Use program loops to configure a group of commands to be executed a set number of times. –The loop uses a counter to track the number of times the command block has been run.

22. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 22 Working with Program Loops Creating a For loop

23. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 23 Working with Program Loops Nesting a For loop

24. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 24 Working with Program Loops Creating a While loop

25. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 25 Working with Program Loops Nesting a While loop

26. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 26 Debugging Your JavaScript Programs Three types of errors: –Load-time errors (occurs when the script is loading) –Run-time errors (occurs when the being executed) –Logical errors (free from syntax and structural mistakes, but result in incorrect results)

27. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 27 Common Mistakes You need to debug your program to fix the mistakes. Common mistakes include: –Misspelling a variable name –Mismatched parentheses or braces –Mismatched quotes –Missing quotes –Using ( instead of [ –Using = in place of ==

28. XP Tutorial 10New Perspectives on HTML and XHTML, Comprehensive 28 Debugging Tools and Techniques To avoid making mistakes and quickly located those you do make: –Write modular code –Use the Microsoft Script Debugger to debug (for use with Internet Explorer) –Use the Netscape JavaScript Console to debug (for use with Netscape)