1. การสคริปท์ฝั่งลูกข่ายด้วย JavaScript การเขียนโปรแกรมเว็บ

2. Introducing JavaScript  Server-side programs are placed on the server that hosts a Web site  Can be problematic  Client-side programming runs programs on each user’s computer New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 2

3. Introducing JavaScript Server-Side Programming Client-Side Programming New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 3

4. 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 New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 4

5. Comparing Java and JavaScript New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 5

6. 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 New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 6

7. Working with the Script Element  A JavaScript program can either be placed directly in a Web page file or saved in an external text file  Insert a client-side script in a Web page when using the script element script commands New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 7

8. Inserting JavaScript into a Web Page File  Each statement—also known as a command—is a single line that indicates an action for the browser to take  The semicolon notifies the browser that it has reached the end of the statement New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 8

9. Writing Output to the Web Page  An object is any item—from the browser window itself to a document displayed in the browser to an element displayed within the document  A method is a process by which JavaScript manipulates or acts upon the properties of an object New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 9

10. Writing Output to the Web Page  To write text to a Web page, use the following JavaScript commands: document.write(“text”); or document.writeln(“text”)’ where text is the content to be written to the page. The doucment.write() and document.writeln() methods are identical, except that the document.writeln() method preserves any line breaks in the text string New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 10

11. Understanding JavaScript Syntax  JavaScript is case sensitive  Ignores most occurrences of extra white space  Do not break a statement into several lines  The + symbol used in this command combines several text strings into a single text string New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 11

12. Working with Variables  A variable is a named item in a program that stores information  Most JavaScript programs use variables to represent values and text strings New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 12

13. Declaring a JavaScript Variable  You can declare variables with any of the following JavaScript commands: var variable; var variable = value; variable = value; where variable is the name of the variable and value is the initial value of the variable. The first command creates the variable without assigning it a value; the second and third commands both create the variable and assign it a value New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 13

14. Working with Variables and Data  JavaScript variable types:  Numeric variables  String variables  Boolean variables  Null variables  You must declare a variable before using it New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 14

15. 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 New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 15

16. Working with Variables and Data  JavaScript is a weakly typed language  The + symbol can be used with either numeric values or text strings var total = 5 + 4; var emLink = "cadler" + "@" + "mpl.gov"; New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 16

17. Creating a JavaScript Function  A function is a collection of commands that performs an action or returns a value  A function name identifies a function  Parameters are values used by the function  The function is executed only when called by another JavaScript command function_name(parameter values) New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 17

18. Creating a JavaScript Function New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 18

19. Creating a Function to Return a Value  For a function to return a value, it must include a return statement function function_name(parameters){ JavaScript commands return value; } New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 19

20. Accessing an External JavaScript File  The code to access an external script file is:  Place all script elements that reference external files in the document head New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 20

21. Accessing an External JavaScript File New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 21

22. Commenting JavaScript Code  Commenting your code is an important programming practice // comment text New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 22

23. Using Comments to Hide JavaScript Code <!--Hide from nonJavaScript browsers JavaScript commands // Stop hiding from older browsers --> New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 23

24. Debugging Your JavaScript Programs  Debugging is the process of searching code to locate a source of trouble  There are three types of errors:  Load-time errors  Run-time errors  Logical errors New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 24

25. Debugging Your JavaScript Programs  Modular code entails breaking up a program’s different tasks into smaller, more manageable chunks  An alert dialog box is a dialog box generated by JavaScript that displays a text message with an OK button alert(text); New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 25

26. Debugging Your JavaScript Programs  Microsoft offers the Microsoft Script Debugger  Firefox also provides the Firefox Error Console New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 26

27. Debugging Your JavaScript Programs New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 27

28. Introducing onevent Processing  An event is an action that occurs within a Web browser or Web document.  An event handler is a statement that tells browsers what code to run in response to the specified event.  Script New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 28

29. Introducing onevent Processing New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 29

30. Introducing onevent Processing  To insert an event handler as an element attribute, use the syntax... where element is the Web page element, event is the name of an event associated with the element, and script is a command to be run in response to the event New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 30

31. Working with Date Objects  Date objects contain information about a specified date and time  To store a date and time in a variable, use the JavaScript command variable = new Date("month day, year hours:minutes:seconds") where variable is the name of the variable that contains the date object, and month, day, year, hours, minutes, and seconds indicate the date and time to be stored in the object.  Time values are entered in 24-hour time New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 31

32. Working with Date Objects  To store a date and time using numeric values, use the JavaScript command variable = new Date(year, month, day, hours, minutes, seconds) where year, month, day, hours, minutes, and seconds are the values of the date and time, and the month value is an integer from 0 to 11, where 0 = January, 1 = February, and so forth.  Time values are entered in 24-hour time. New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 32

33. Working with Date Objects  To create a date object containing the current date and time, use the following JavaScript command: variable = new Date() New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 33

34. Working with Date Objects  Date methods can be used to retrieve information from a date object or to change a date object’s value New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 34

35. Working with Date Objects New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 35

36. Working with Operators and Operands  An operator is a symbol used to act upon an item or a variable within a JavaScript expression.  The variables or expressions that operators act upon are called operands. New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 36

37. Working with Operators and Operands  Binary operators work with two operands in an expression.  Unary operators work with one operand.  Increment operators increase the value of the operand by 1.  x++;  Decrement operators decrease the value of the operand by 1.  x--; New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 37

38. Working with Operators and Operands  Assignment operators assign values to items.  Equal sign (=)  x = x + y  A common use of the += operator is to concatenate strings or add a value to an existing value of a variable New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 38

39. Working with Operators and Operands New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 39

40. Working with the Math Object and Math Methods  The Math object is an object that can be used for performing mathematical tasks and storing mathematical values.  Math methods store functions used for performing advanced calculations and mathematical operations such as:  Generating random numbers  Extracting square roots  Calculating trigonometric values New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 40

41. Working with the Math Object and Math Methods New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 41

42. Working with the Math Object and Math Methods  The Math object also stores numeric values for mathematical constants. New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 42

43. Controlling How JavaScript Works with Numeric Values  Some mathematical operations can return results that are not numeric values.  You cannot divide a number by a text string  Returns “NaN”  You cannot divide a number by zero  Returns “Infinity”  The isNaN function is a Boolean function that tests a value to see whether it is numeric or not.  The isFinite function is a Boolean function that checks for the value of Infinity. New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 43

44. Controlling How JavaScript Works with Numeric Values New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 44

45. Working with Conditional, Comparison, and Logical Operators  A conditional operator is a ternary operator that tests whether a certain condition is true or not.  A comparison operator is an operator that compares the value of one expression to another. New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 45

46. Working with Conditional, Comparison, and Logical Operators  Logical operators allow you to connect several expressions New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 46

47. Running Timed Commands  A time-delayed command is a JavaScript command that is run after a specified amount of time has passed. setTimeout(“command”, delay); clearTimeout();  A time-interval command instructs the browser to run the same command repeatedly at specified intervals. setInterval (“command”, interval); clearInterval(); New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 47

48. Working with Arrays  An array is a collection of data values organized under a single name  Each individual data value is identified by an index  To create an array:  var array = new Array(length);  To populate an array:  array[i] = value;  var array = [values];  To create and populate an array:  var array = new Array(values); New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 48

49. Specifying Array Length  To determine the size of an array, use the property:  array.length  To add more items to an array, run the command:  array[i] = value;  To remove items from an array, run the command:  array.length = value; New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 49

50. Using Array Methods New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 50

51. Working with Program Loops  A program loop is a set of commands that is executed repeatedly until a stopping condition has been met  For loop  A counter variable tracks the number of times a set of commands is run  The collection of commands that is run each time through a loop is collectively known as a command block New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 51

52. Working with Program Loops  For loops are often used to cycle through the different values contained within an array New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 52

53. Working with Program Loops  A while loop does not depend on the value of a counter variable; it runs as long as a specific condition is met New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 53

54. Creating Program Loops  To create a For loop, use the syntax: for (start; continue; update) { commands }  To create a While loop, use the following syntax: while (continue) { commands } New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 54

55. Creating Program Loops  To create a Do/While loop, use the following syntax: do { commands } while (continue);  To loop through the contents of an array, enter the For loop: for (var i = 0; i < array.length; i++) { commands involving array[i] } New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 55

56. Working with Conditional Statements  A conditional statement is a statement that runs a command or command block only when certain circumstances are met New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 56

57. Working with Conditional Statements  To test a single condition, use the construction: if (condition) { commands }  To test between two conditions, use the following construction: if (condition) { commands if condition is true } else { commands if otherwise } New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 57

58. Working with Conditional Statements  To test multiple conditions, use the construction: if (condition 1) { first command block } else if (condition 2) { second command block } else if (condition 3) { third command block } else { default command block } New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 58

59. Creating a Switch Statement  To create a Switch statement to test for different values of an expression, use the structure: switch (expression) { case label1: commands1 break; case label2: commands2 break; case label3: commands3 break;... default: default commands } New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 59

60. Managing Program Loops and Conditional Statements  The break command terminates any program loop or conditional statement  The syntax for the break command is:  break;  The continue command stops processing the commands in the current iteration of the loop and jumps to the next iteration  continue; New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 60

61. Managing Program Loops and Conditional Statements  Labels are used to identify statements in JavaScript code so that you can reference those statements elsewhere in a program  label: statement  break label;  continue label; New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 61

62. Using Multidimensional Arrays  A matrix is a multidimensional array in which each item is referenced by two or more index values  In a matrix, each value is referenced by a row index number and column index number  Although matrices are commonly used in various programming languages, JavaScript does not support them New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 62

63. Introducing Pull-Down Menus  In a pull-down menu, a menu title is always visible to the user, identifying the entries in the menu New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 63

64. Introducing Objects, Properties, Methods, and Events  JavaScript is an object-based language  Based on manipulating objects through the use of properties, methods, and events  JavaScript supports three types of objects  Built-in objects  Document objects  Customized objects New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 64

65. Exploring the Document Object Model  The organized structure of objects is called the document object model (DOM)  Goal is to make every object related to the document or to the Web browser accessible to a scripting language New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 65

66. Exploring the Document Object Model  Each document object model organizes objects into a hierarchy known as a document tree New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 66

67. Referencing Objects  Each object is identified by an object name  To indicate the location of an object within the hierarchy, you separate each level using a dot  Dot syntax New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 67

68. Referencing Objects  Object collections are arrays consisting of more than one of the same type of object New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 68

69. Referencing Objects  To reference an object as part of the collection in a document, use either collection[idref] or collection.idref  To reference a document object based on its ID, use: document.getElementById(id)  To reference an array of elements based on the tag name, use: object.getElementsByTagName(tag)  To reference an array of elements based on the value of the name attribute, use: document.getElementsByName(name) New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 69

70. Working with Object Properties  Most objects are associated with one or more properties  object.property  To set the value of an object property, use: object.property = expression  To apply a CSS style to a document object, use: object.style.attribute = expression New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 70

71. Exploring Object Methods  The syntax for applying a method to an object is object.method(parameters) New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 71

72. Working with Event Handlers  All objects can be affected by events initiated by the user or browser New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 72

73. Programming a Pull-Down Menu  The this keyword references the currently active object in the Web browser New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 73

74. Animating a Pull-Down Menu  Create the illusion of a menu being pulled down New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 74

75. Animating a Pull-Down Menu New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 75

76. Creating Other Types of Menus  In a pop-up menu, a user clicks an object on the page and the menu appears, sometimes elsewhere on the page  In a sliding menu, a menu is partially hidden either off the Web page or behind another object New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 76

77. Creating Other Types of Menus  In a tabbed menu, several menus are stacked on the page with one part of each menu visible to the user New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 77

78. Exploring Custom Objects  Specific objects are referred to as instances of the object, while the general object itself is the object class  var thisDate = new Date();  An object constructor is a function that defines the properties of a whole class of objects New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 78

79. Working with Forms and Fields New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 79

80. Working with Forms and Fields  Referencing a Web form  You have to work with the properties and methods of the form object and the elements it contains  JavaScript supports an object collection for forms document.forms[idref] or document.forms[“form1”] New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 80

81. Working with Forms and Fields  Referencing a Web form New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 81

82. Working with Forms and Fields  Referencing a form element  The elements within a form are organized into an elements collection  Can reference a form element either by its position in the collection or by its name or id attributes New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 82

83. Working with Forms and Fields  Referencing a form element New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 83

84. Working with Input Fields  Setting the field value  To set the value contained in a field such as an input box, you use the value property  The general syntax is: formObject.element.value = fieldvalue; New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 84

85. Working with Input Fields  Setting the field value New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 85

86. Working with Input Fields  Navigating between fields  To place the cursor in a particular field on a form, use: formObject.element.focus();  To remove the focus from this field, use: formObject.element.blur(); New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 86

87. Working with Selection Lists  To reference a particular option in the collection, use: selection.options[idref] New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 87

88. Working with Selection Lists New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 88

89. Working with Selection Lists New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 89

90. Working with Option Buttons and Check Boxes  Using option buttons  Option buttons have the reference options[idref]  Where options is the reference to the group of option buttons and idref is either the index number or id of the individual option button New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 90

91. Working with Option Buttons and Check Boxes  Using the “this” keyword  The this keyword is a JavaScript object reference that refers to the currently selected object, whatever that may be New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 91

92. Working with Option Buttons and Check Boxes  Working with check boxes  Work the same way as option buttons  In addition, the value associated with a check box is stored in the value property of the check box object  This value is applied only when the check box is checked  When unchecked, its field has no value assigned to it New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 92

93. Creating Calculated Fields  Converting between text strings and numeric values  Explicitly indicate that you want to convert parseFloat(text) New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 93

94. Working with Form Validation  Form validation is a process by which the server or user’s browser checks a form for data entry errors  With server-side validation, a form is sent to the Web server for checking  In client-side validation, the Web browser checks the form, which is not submitted to the server until it passes inspection New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 94

95. Working with Form Validation  Submitting a Form  To control this submission process, JavaScript provides the onsubmit event handler formobj.onsubmit = function;  If the function returns a value of false, the submit event is cancelled, while a value of true allows the submit event to continue unabated New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 95

96. Working with Form Validation  Alerting the user  An alert box is a dialog box that displays an informative message to the user along with an OK button alert(message); New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 96

97. Working with Text Strings  The string object  JavaScript treats each text string as an object called a string object  The most common way to create a string object is to assign a text string to a variable  You can also create a string object using the object constructor stringVariable = new String("text") New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 97

98. Working with Text Strings  Calculating the length of a text string  The following code calculates the number of characters in the stringVar variable, storing the value 17 in the lengthValue variable stringVar = "GPS-ware Products"; lengthValue = stringVar.length New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 98

99. Working with Text Strings  Working with the string object methods  To determine the number of characters in a text string, use the object property string.length  To extract a character from a text string, use the method string.charAt(i)  To extract a substring from a text string, use the method string.slice(start, end) New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 99

100. Working with Text Strings  Working with the string object methods  To split a string into several substrings, use the command strArray = string.split(str)  To search a string, use the method string.indexOf(str, start) New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 100

101. Working with Text Strings  Formatting text strings New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 101

102. Introducing Regular Expressions  A regular expression is a text string that defines a character pattern  One use of regular expressions is pattern- matching, in which a text string is tested to see whether it matches the pattern defined by a regular expression New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 102

103. Introducing Regular Expressions  Creating a regular expression  You create a regular expression in JavaScript using the command re = /pattern/;  This syntax for creating regular expressions is sometimes referred to as a regular expression literal New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 103

104. Introducing Regular Expressions  Matching a substring  The most basic regular expression consists of a substring that you want to locate in the test string  The regular expression to match the first occurrence of a substring is /chars/ New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 104

105. Introducing Regular Expressions  Setting regular expression flags  To make a regular expression not sensitive to case, use the regular expression literal /pattern/i  To allow a global search for all matches in a test string, use the regular expression literal /pattern/g New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 105

106. Introducing Regular Expressions  Defining character positions New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 106

107. Introducing Regular Expressions  Defining character positions New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 107 New Perspectives on HTML, XHTML, and DHTML, Comprehensive

108. Introducing Regular Expressions  Defining character positions  Can specify a collection of characters known as a character class to limit the regular expression to only a select group of characters New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 108

109. Introducing Regular Expressions  Defining character positions New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 109

110. Introducing Regular Expressions  Repetition characters New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 110

111. Introducing Regular Expressions  Escape Sequences  An escape sequence is a special command inside a text string that tells the JavaScript interpreter not to interpret what follows as a character  The character which indicates an escape sequence in a regular expression is the backslash character \ New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 111

112. Introducing Regular Expressions  Escape Sequences New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 112

113. Introducing Regular Expressions  The regular expression object New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 113

114. Working with the Regular Expression Object  Validating a zip code New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 114

115. Validating Financial Information  Removing blank spaces from credit card numbers New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 115

116. Validating Financial Information  Validating credit card number patterns New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 116

117. Validating Financial Information  The Luhn Formula  All credit card numbers must satisfy the Luhn Formula, or Mod10 algorithm, which is a formula developed by a group of mathematicians in the 1960s to provide a quick validation check on an account number by adding up the digits in the number New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 117

118. Passing Data Between Forms  Appending Form Data  Text strings can be appended to any URL by adding the ? character to the Web address followed by the text string  Use the get method  One property of the location object is the location.search property, which contains the text of any data appended to the URL, including the ? character New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 118

119. Passing Data from a Form  Appending data to a URL  There are several limitations to the technique of appending data to a URL  URLs are limited in their length  Characters other than letters and numbers cannot be passed in the URL without modification  URLs cannot contain blank spaces, for example, a blank space is converted to the character code %20 New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 119

120. Passing Data from a Form  Appending and retrieving form data  Can use the technique of appending data to the URL with Web forms, too  Do this by setting a form’s action attribute to the URL of the page to which you want to pass the data, and setting the method of the form to “get” New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 120

121. Passing Data from a Form  Appending and retrieving form data  Use the location.search property and the slice() method to extract only the text string of the field names and values  Use the unescape() function to remove any escape sequences characters from the text string  Convert each occurrence of the + symbol to a blank space  Split the text string at every occurrence of an = or & character, storing the substrings into an array New Perspectives on HTML, XHTML, and Dynamic HTML, 4e 121