Introduction |
|
xix | |
Chapter 1 Introduction To Javascript And The Web |
|
1 | (16) |
|
Introduction to JavaScript |
|
|
1 | (6) |
|
|
2 | (1) |
|
|
3 | (1) |
|
What Can JavaScript Do for Me? |
|
|
4 | (1) |
|
Tools Needed to Create JavaScript Web Applications |
|
|
4 | (3) |
|
|
4 | (1) |
|
|
5 | (2) |
|
|
7 | (2) |
|
Linking to an External JavaScript File |
|
|
7 | (1) |
|
Advantages of Using an External File |
|
|
8 | (1) |
|
Your First Simple JavaScript Program |
|
|
9 | (1) |
|
|
10 | (5) |
|
A Brief Look at Browsers and Compatibility Problems |
|
|
15 | (1) |
|
|
16 | (1) |
Chapter 2 Data Types And Variables |
|
17 | (38) |
|
Types of Data in JavaScript |
|
|
18 | (2) |
|
|
18 | (1) |
|
|
19 | (1) |
|
|
20 | (1) |
|
Variables-Storing Data in Memory |
|
|
20 | (6) |
|
Creating Variables and Giving Them Values |
|
|
22 | (2) |
|
Assigning Variables with the Value of Other Variables |
|
|
24 | (2) |
|
Using Data-Calculations and Basic String Manipulation |
|
|
26 | (12) |
|
|
26 | (4) |
|
Increment and Decrement Operators |
|
|
29 | (1) |
|
|
30 | (5) |
|
|
35 | (2) |
|
Mixing Numbers and Strings |
|
|
37 | (1) |
|
|
38 | (5) |
|
Dealing with Strings That Won't Convert |
|
|
41 | (2) |
|
|
43 | (9) |
|
A Multi-Dimensional Array |
|
|
47 | (5) |
|
|
52 | (3) |
Chapter 3 Decisions And Loops |
|
55 | (32) |
|
Decision Making-The if and switch Statements |
|
|
56 | (20) |
|
|
56 | (2) |
|
|
57 | (1) |
|
Assignment versus Comparison |
|
|
57 | (1) |
|
Assigning the Results of Comparisons |
|
|
58 | (1) |
|
|
58 | (4) |
|
|
62 | (3) |
|
|
63 | (1) |
|
|
64 | (1) |
|
|
64 | (1) |
|
Multiple Conditions Inside an if Statement |
|
|
65 | (4) |
|
|
69 | (1) |
|
|
70 | (1) |
|
|
71 | (5) |
|
Executing the Same Code for Different Cases |
|
|
75 | (1) |
|
Looping-The for and while Statements |
|
|
76 | (8) |
|
|
76 | (4) |
|
|
80 | (1) |
|
|
80 | (2) |
|
|
82 | (1) |
|
The break and continue Statements |
|
|
83 | (1) |
|
|
84 | (3) |
Chapter 4 Functions And Scope |
|
87 | (12) |
|
Creating Your Own Functions |
|
|
88 | (4) |
|
|
92 | (2) |
|
|
92 | (1) |
|
|
93 | (1) |
|
|
93 | (1) |
|
|
94 | (3) |
|
|
97 | (2) |
Chapter 5 JavaScript-an Object-Based Language |
|
99 | (54) |
|
|
100 | (5) |
|
|
100 | (1) |
|
|
100 | (1) |
|
|
101 | (3) |
|
|
102 | (1) |
|
Using an Object's Properties |
|
|
103 | (1) |
|
Calling an Object's Methods |
|
|
104 | (1) |
|
|
104 | (1) |
|
JavaScript's Native Object Types |
|
|
105 | (39) |
|
|
105 | (11) |
|
|
106 | (1) |
|
Finding a String Inside Another String-The indexOf() and lastIndex0f0 Methods |
|
|
106 | (3) |
|
Copying Part of a String-The substr() and substring() Methods |
|
|
109 | (1) |
|
Converting Case-The toLowerCase() and toUpperCase() Methods |
|
|
110 | (1) |
|
Selecting a Single Character from a String-The charAt() and charCodeAt() Methods |
|
|
111 | (4) |
|
Converting Character Codes to a String-The fromCharCode() Method |
|
|
115 | (1) |
|
Removing Leading and Trailing Whitespace-The trim() Method |
|
|
115 | (1) |
|
|
116 | (10) |
|
Finding Out How Many Elements Are in an Array-The length Property |
|
|
116 | (1) |
|
Adding Elements-The push() Method |
|
|
117 | (1) |
|
Joining Arrays-The concat() Method |
|
|
117 | (1) |
|
Copying Part of an Array-The slice() Method |
|
|
118 | (1) |
|
Converting an Array into a Single String-The join() Method |
|
|
119 | (1) |
|
Putting Your Array in Order-The sort() Method |
|
|
119 | (2) |
|
Putting Your Array into Reverse Order-The reverse() Method |
|
|
121 | (1) |
|
Finding Array Elements-The index0i() and lastIndex0f() Methods |
|
|
122 | (1) |
|
Iterating through an Array without Loops |
|
|
123 | (3) |
|
|
126 | (8) |
|
|
127 | (1) |
|
Finding the Largest and Smallest Numbers-The min() and max() Methods |
|
|
127 | (1) |
|
|
127 | (4) |
|
|
131 | (1) |
|
|
132 | (2) |
|
|
134 | (1) |
|
|
134 | (1) |
|
|
135 | (13) |
|
|
135 | (1) |
|
|
136 | (3) |
|
|
139 | (1) |
|
|
140 | (1) |
|
|
140 | (3) |
|
|
143 | (1) |
|
Creating Your Own Custom Objects |
|
|
144 | (4) |
|
Creating New Types of Objects (Reference Types) |
|
|
148 | (3) |
|
Defining a Reference Type |
|
|
149 | (1) |
|
Creating and Using Reference Type Instances |
|
|
150 | (1) |
|
|
151 | (2) |
Chapter 6 String Manipulation |
|
153 | (40) |
|
Additional String Methods |
|
|
154 | (4) |
|
|
154 | (2) |
|
|
156 | (1) |
|
|
157 | (1) |
|
|
157 | (1) |
|
|
158 | (17) |
|
Simple Regular Expressions |
|
|
159 | (3) |
|
Regular Expressions: Special Characters |
|
|
162 | (8) |
|
Text, Numbers, and Punctuation |
|
|
162 | (3) |
|
|
165 | (1) |
|
|
166 | (4) |
|
Covering All Eventualities |
|
|
170 | (1) |
|
Grouping Regular Expressions |
|
|
171 | (2) |
|
Reusing Groups of Characters |
|
|
173 | (2) |
|
|
175 | (8) |
|
|
175 | (2) |
|
|
177 | (2) |
|
|
179 | (1) |
|
|
180 | (3) |
|
Using the RegExp Object's Constructor |
|
|
183 | (8) |
|
Telephone Number Validation |
|
|
185 | (2) |
|
|
187 | (2) |
|
Validating an E-mail Address |
|
|
189 | (5) |
|
|
189 | (1) |
|
Validating a Person's Address |
|
|
190 | (1) |
|
Validating the Complete Address |
|
|
190 | (1) |
|
|
191 | (2) |
Chapter 7 Date, Time, And Timers |
|
193 | (12) |
|
|
194 | (6) |
|
Setting and Getting a Date Object's UTC Date and Time |
|
|
197 | (3) |
|
|
200 | (3) |
|
|
200 | (2) |
|
Setting a Timer that Fires at Regular Intervals |
|
|
202 | (1) |
|
|
203 | (2) |
Chapter 8 Programming The Browser |
|
205 | (24) |
|
Introduction to the Browser's Objects |
|
|
206 | (12) |
|
|
207 | (1) |
|
|
208 | (1) |
|
|
209 | (1) |
|
|
210 | (3) |
|
|
210 | (3) |
|
|
213 | (1) |
|
|
213 | (1) |
|
Using the document Object |
|
|
214 | (2) |
|
|
216 | (2) |
|
|
218 | (1) |
|
Determining the User's Browser |
|
|
218 | (7) |
|
|
218 | (3) |
|
|
221 | (4) |
|
|
225 | (4) |
Chapter 9 DOM Scripting |
|
229 | (42) |
|
|
231 | (3) |
|
|
232 | (1) |
|
|
233 | (1) |
|
The Document Object Model |
|
|
234 | (25) |
|
|
234 | (2) |
|
|
234 | (1) |
|
|
234 | (1) |
|
|
235 | (1) |
|
|
235 | (1) |
|
|
235 | (1) |
|
Browser Compliance with the Standards |
|
|
235 | (1) |
|
Differences between the DOM and the BOM |
|
|
236 | (1) |
|
Representing the HTML Document as a Tree Structure |
|
|
236 | (2) |
|
What Is a Tree Structure? |
|
|
236 | (1) |
|
|
237 | (1) |
|
|
238 | (2) |
|
|
238 | (1) |
|
|
239 | (1) |
|
DOM Objects and Their Properties and Methods |
|
|
240 | (19) |
|
The Document Object and its Methods |
|
|
240 | (6) |
|
|
246 | (4) |
|
|
250 | (9) |
|
|
259 | (9) |
|
|
259 | (1) |
|
|
259 | (4) |
|
|
259 | (3) |
|
Changing the class Attribute |
|
|
262 | (1) |
|
Positioning and Moving Content |
|
|
263 | (1) |
|
Example: Animated Advertisement |
|
|
264 | (9) |
|
|
264 | (1) |
|
|
265 | (3) |
|
|
268 | (3) |
Chapter 10 Events |
|
271 | (64) |
|
|
272 | (1) |
|
Connecting Code to Events |
|
|
273 | (10) |
|
Handling Events via HTML Attributes |
|
|
273 | (7) |
|
Handling Events via Object Properties |
|
|
280 | (3) |
|
|
283 | (15) |
|
Connecting Code to Events-The Standard Way |
|
|
283 | (6) |
|
|
289 | (9) |
|
Event Handling in Old Versions of Internet Explorer |
|
|
298 | (9) |
|
Accessing the event Object |
|
|
298 | (2) |
|
|
300 | (7) |
|
Writing Cross-Browser Code |
|
|
307 | (10) |
|
|
317 | (16) |
|
|
318 | (1) |
|
|
319 | (6) |
|
|
325 | (8) |
|
|
333 | (2) |
Chapter 11 HTML Forms: Interacting With The User |
|
335 | (56) |
|
|
336 | (2) |
|
Traditional Form Object Properties and Methods |
|
|
338 | (37) |
|
|
339 | (1) |
|
Common Properties and Methods |
|
|
340 | (1) |
|
|
340 | (1) |
|
|
340 | (1) |
|
|
340 | (1) |
|
|
340 | (1) |
|
The focus() and blur() Methods |
|
|
340 | (1) |
|
|
341 | (4) |
|
|
345 | (6) |
|
|
345 | (5) |
|
Problems with Firefox and the blur Event |
|
|
350 | (1) |
|
|
351 | (1) |
|
|
351 | (1) |
|
|
351 | (4) |
|
Check Boxes and Radio Buttons |
|
|
355 | (9) |
|
|
364 | (11) |
|
Adding and Removing Options |
|
|
365 | (4) |
|
Adding New Options with Standard Methods |
|
|
369 | (1) |
|
|
370 | (5) |
|
HTML5 Form Object Properties and Methods |
|
|
375 | (11) |
|
|
376 | (4) |
|
|
380 | (13) |
|
|
380 | (2) |
|
The <meter/> and <progress/> Elements |
|
|
382 | (4) |
|
|
386 | (5) |
Chapter 12 JSON |
|
391 | (12) |
|
|
392 | (1) |
|
|
393 | (7) |
|
|
394 | (1) |
|
|
394 | (1) |
|
|
395 | (1) |
|
|
396 | (1) |
|
|
396 | (4) |
|
|
400 | (3) |
Chapter 13 Data Storage |
|
403 | (32) |
|
|
404 | (12) |
|
|
404 | (9) |
|
Viewing Cookies in Internet Explorer |
|
|
404 | (5) |
|
Viewing Cookies in Firefox |
|
|
409 | (2) |
|
Viewing Cookies in Chrome |
|
|
411 | (2) |
|
|
413 | (11) |
|
|
413 | (1) |
|
|
413 | (1) |
|
|
414 | (1) |
|
|
415 | (1) |
|
|
416 | (1) |
|
|
416 | (3) |
|
|
419 | (5) |
|
|
424 | (1) |
|
A User May Disable Cookies |
|
|
424 | (1) |
|
Number and Information Limitation |
|
|
425 | (1) |
|
|
425 | (1) |
|
|
426 | (6) |
|
|
427 | (1) |
|
|
428 | (1) |
|
|
428 | (1) |
|
|
428 | (3) |
|
Viewing Web Storage Content |
|
|
431 | (1) |
|
|
432 | (3) |
Chapter 14 AJAX |
|
435 | (28) |
|
|
436 | (2) |
|
|
436 | (1) |
|
|
436 | (1) |
|
|
436 | (1) |
|
|
436 | (2) |
|
Using the XMLHttpRequest Object |
|
|
438 | (3) |
|
Creating an XMLHttpRequest Object |
|
|
438 | (1) |
|
Using the XMLHttpRequest Object |
|
|
438 | (2) |
|
|
440 | (1) |
|
Creating a Simple Ajax Module |
|
|
441 | (3) |
|
Planning the HttpRequest Module |
|
|
441 | (1) |
|
The HttpRequest Constructor |
|
|
442 | (1) |
|
Creating the send() Method |
|
|
443 | (1) |
|
|
443 | (1) |
|
Validating Form Fields with Ajax |
|
|
444 | (9) |
|
|
445 | (1) |
|
|
445 | (1) |
|
|
446 | (7) |
|
|
446 | (1) |
|
|
447 | (6) |
|
|
453 | (9) |
|
|
454 | (1) |
|
|
454 | (1) |
|
|
454 | (1) |
|
|
455 | (12) |
|
The Browser's Back Button |
|
|
455 | (1) |
|
Creating a Back/Forward-Capable Form with an IFrame |
|
|
455 | (1) |
|
|
456 | (4) |
|
|
460 | (1) |
|
Degrade Gracefully When Ajax Fails |
|
|
461 | (1) |
|
|
462 | (1) |
Chapter 15 HTML5 Media |
|
463 | (20) |
|
|
464 | (3) |
|
|
467 | (14) |
|
|
468 | (3) |
|
|
471 | (6) |
|
|
477 | (4) |
|
|
481 | (2) |
Chapter 16 jQuery |
|
483 | (22) |
|
|
484 | (1) |
|
|
485 | (19) |
|
|
485 | (2) |
|
|
487 | (3) |
|
Adding and Removing CSS Classes |
|
|
488 | (1) |
|
|
489 | (1) |
|
Checking if a Class Exists |
|
|
490 | (1) |
|
Creating, Appending, and Removing Elements |
|
|
490 | (2) |
|
|
491 | (1) |
|
|
491 | (1) |
|
|
492 | (1) |
|
|
492 | (2) |
|
|
493 | (1) |
|
Rewriting the Tab Strip with jQuery |
|
|
494 | (3) |
|
|
497 | (9) |
|
Understanding the jQuery Function |
|
|
497 | (1) |
|
Automatically Parsing JSON Data |
|
|
498 | (1) |
|
|
498 | (6) |
|
|
504 | (1) |
Chapter 17 Other Javascript Libraries |
|
505 | (44) |
|
|
506 | (9) |
|
|
507 | (1) |
|
|
508 | (1) |
|
|
509 | (1) |
|
|
510 | (5) |
|
|
515 | (16) |
|
|
515 | (1) |
|
Testing Your Prototype Installation |
|
|
516 | (1) |
|
|
517 | (2) |
|
Selecting Elements with CSS Selectors |
|
|
518 | (1) |
|
Performing an Operation on Elements Selected with $$() |
|
|
519 | (1) |
|
|
519 | (1) |
|
Creating, Inserting, and Removing Elements |
|
|
520 | (1) |
|
|
520 | (1) |
|
|
520 | (1) |
|
|
521 | (1) |
|
|
521 | (1) |
|
Rewriting the Tab Strip with Prototype |
|
|
522 | (3) |
|
|
525 | (6) |
|
|
531 | (15) |
|
|
531 | (1) |
|
Testing Your MooTools Installation |
|
|
531 | (2) |
|
|
533 | (1) |
|
Selecting Elements with CSS Selectors |
|
|
533 | (1) |
|
Performing Operations on Elements |
|
|
533 | (1) |
|
|
534 | (1) |
|
Creating, Inserting, and Removing Elements |
|
|
535 | (1) |
|
|
536 | (1) |
|
Rewriting the Tab Strip with MooTools |
|
|
537 | (3) |
|
|
540 | (6) |
|
|
546 | (3) |
Chapter 18 Common Mistakes, Debugging, And Error Handling |
|
549 | (38) |
|
D'oh! I Can't Believe I Just Did That: Some Common Mistakes |
|
|
550 | (5) |
|
|
550 | (1) |
|
|
551 | (1) |
|
Incorrect Number of Closing Braces |
|
|
552 | (1) |
|
Incorrect Number of Closing Parentheses |
|
|
553 | (1) |
|
Using Equals (=) Rather than Equality (==) |
|
|
553 | (1) |
|
Using a Method as a Property and Vice Versa |
|
|
554 | (1) |
|
Missing Plus Signs during Concatenation |
|
|
554 | (1) |
|
|
555 | (8) |
|
|
555 | (1) |
|
The try...catch Statements |
|
|
556 | (7) |
|
|
557 | (5) |
|
Nested try...catch Statements |
|
|
562 | (1) |
|
|
562 | (1) |
|
|
563 | (20) |
|
Debugging in Chrome (and Opera) |
|
|
564 | (10) |
|
|
566 | (1) |
|
Scope Variables and Watches |
|
|
566 | (1) |
|
|
567 | (4) |
|
|
571 | (2) |
|
|
573 | (1) |
|
Debugging in Internet Explorer |
|
|
574 | (4) |
|
|
576 | (1) |
|
|
576 | (1) |
|
|
576 | (1) |
|
|
577 | (1) |
|
Debugging in Firefox with Firebug |
|
|
578 | (2) |
|
|
578 | (1) |
|
|
579 | (1) |
|
|
580 | (1) |
|
|
580 | (1) |
|
|
580 | (3) |
|
|
583 | (1) |
|
|
583 | (1) |
|
|
583 | (1) |
|
|
583 | (1) |
|
|
583 | (4) |
Appendix A: Answers To Exercises |
|
587 | (66) |
Appendix B: Javascript Core Reference |
|
653 | (30) |
Appendix C: W3C Dom Reference |
|
683 | (32) |
Appendix D: Latin-1 Character Set |
|
715 | (8) |
Index |
|
723 | |