Section 1 JavaScript essentials |
|
|
Chapter 1 Introduction to web development |
|
|
|
How a web application works |
|
|
4 | (10) |
|
The components of a web application |
|
|
4 | (2) |
|
How static web pages are processed |
|
|
6 | (2) |
|
How dynamic web pages are processed |
|
|
8 | (2) |
|
How JavaScript is used for client-side processing |
|
|
10 | (2) |
|
What you need to know about the ECMAScript specification |
|
|
12 | (2) |
|
The components of a JavaScript application |
|
|
14 | (6) |
|
|
14 | (2) |
|
|
16 | (2) |
|
|
18 | (2) |
|
The HTML skills that you need for this book |
|
|
20 | (6) |
|
How to use the HTML5 semantic elements |
|
|
20 | (2) |
|
How to use the div and span elements |
|
|
22 | (2) |
|
How to use the basic HTML attributes |
|
|
24 | (2) |
|
The CSS skills that you need for this book |
|
|
26 | (6) |
|
How to provide the CSS styles for an HTML page |
|
|
26 | (2) |
|
How to code the basic CSS selectors |
|
|
28 | (2) |
|
How to code CSS style rules |
|
|
30 | (2) |
|
How to test a JavaScript application |
|
|
32 | (6) |
|
How to run a JavaScript application |
|
|
32 | (2) |
|
How to find errors in your code |
|
|
34 | (2) |
|
How to provide cross-browser compatibility |
|
|
36 | (2) |
|
How to use Aptana to develop JavaScript applications |
|
|
38 | (14) |
|
How to create or import a project |
|
|
38 | (2) |
|
|
40 | (2) |
|
|
42 | (2) |
|
How to run a JavaScript application |
|
|
44 | (8) |
|
Chapter 2 Getting started with JavaScript |
|
|
|
How to include JavaScript in an HTML document |
|
|
52 | (4) |
|
Two ways to include JavaScript in the head of an HTML document |
|
|
52 | (2) |
|
How to include JavaScript in the body of an HTML document |
|
|
54 | (2) |
|
|
56 | (6) |
|
How to code JavaScript statements |
|
|
56 | (2) |
|
How to create identifiers |
|
|
58 | (2) |
|
|
60 | (2) |
|
How to work with JavaScript data |
|
|
62 | (10) |
|
|
62 | (2) |
|
How to declare and assign values to variables |
|
|
64 | (2) |
|
How to code arithmetic expressions |
|
|
66 | (2) |
|
How to use arithmetic expressions in assignment statements |
|
|
68 | (2) |
|
How to concatenate strings and include special characters in strings |
|
|
70 | (2) |
|
How to use objects, methods, and properties |
|
|
72 | (6) |
|
Introduction to objects, methods, and properties |
|
|
72 | (2) |
|
How to use the parselnt() and parseFloat() methods of the window object |
|
|
74 | (2) |
|
How to use the write() and writeln() methods of the document object |
|
|
76 | (2) |
|
Two illustrative applications |
|
|
78 | (8) |
|
The Miles Per Gallon application |
|
|
78 | (2) |
|
The Test Scores application |
|
|
80 | (6) |
|
Chapter 3 The essential JavaScript statements |
|
|
|
How to code conditional expressions |
|
|
86 | (4) |
|
How to use the relational operators |
|
|
86 | (2) |
|
How to use the logical operators |
|
|
88 | (2) |
|
How to code the basic control statements |
|
|
90 | (6) |
|
How to code if statements |
|
|
90 | (2) |
|
How to code while and do-while loops |
|
|
92 | (2) |
|
|
94 | (2) |
|
Three illustrative applications |
|
|
96 | (6) |
|
The enhanced Miles Per Gallon application |
|
|
96 | (2) |
|
The Future Value application |
|
|
98 | (2) |
|
The enhanced Test Scores application |
|
|
100 | (2) |
|
|
102 | (4) |
|
How to create and use arrays |
|
|
102 | (2) |
|
How to use for loops to work with arrays |
|
|
104 | (2) |
|
The Test Scores application with an array |
|
|
106 | (6) |
|
|
106 | (1) |
|
|
106 | (6) |
|
Chapter 4 How to work with JavaScript objects, functions, and events |
|
|
|
How to use objects to work with data |
|
|
112 | (6) |
|
How to use the window and document objects |
|
|
112 | (2) |
|
How to use Textbox and Number objects |
|
|
114 | (2) |
|
How to use Date and String objects |
|
|
116 | (2) |
|
|
118 | (8) |
|
How to create and call a function expression |
|
|
118 | (2) |
|
How to create and call a function declaration |
|
|
120 | (2) |
|
When and how to use local and global variables |
|
|
122 | (2) |
|
When and how to use strict mode |
|
|
124 | (2) |
|
|
126 | (4) |
|
How to attach an event handler to an event |
|
|
126 | (2) |
|
How to use an onload event handler to attach other event handlers |
|
|
128 | (2) |
|
Two illustrative applications |
|
|
130 | (12) |
|
The Miles Per Gallon application |
|
|
130 | (2) |
|
The Email List application |
|
|
132 | (10) |
|
Chapter 5 How to test and debug a JavaScript application |
|
|
|
An introduction to testing and debugging |
|
|
142 | (8) |
|
The three types of errors that can occur |
|
|
142 | (2) |
|
|
144 | (2) |
|
How to plan the test runs |
|
|
146 | (2) |
|
How to use top-down coding and testing to simplify debugging |
|
|
148 | (2) |
|
How to debug with Chrome's developer tools |
|
|
150 | (4) |
|
How to use Chrome to find errors |
|
|
150 | (2) |
|
How to use breakpoints and step through your code |
|
|
152 | (2) |
|
|
154 | (10) |
|
How to trace the execution of your JavaScript code |
|
|
154 | (2) |
|
How to view the source code |
|
|
156 | (2) |
|
When and how to validate the HTML |
|
|
158 | (6) |
|
Chapter 6 How to script the DOM with JavaScript |
|
|
|
DOM scripting properties and methods |
|
|
164 | (8) |
|
|
164 | (2) |
|
The properties of the Node interface |
|
|
166 | (2) |
|
The methods of the Document and Element interfaces |
|
|
168 | (2) |
|
The properties of the DOM HTML specification |
|
|
170 | (2) |
|
|
172 | (4) |
|
|
172 | (2) |
|
|
174 | (2) |
|
How to script forms and controls |
|
|
176 | (8) |
|
|
176 | (2) |
|
How to script Textbox, Textarea, and Select objects |
|
|
178 | (2) |
|
How to script Radio and Checkbox objects |
|
|
180 | (2) |
|
How to use the methods and events for forms and controls |
|
|
182 | (2) |
|
|
184 | (4) |
|
|
184 | (2) |
|
|
186 | (2) |
|
How to add and remove nodes from the DOM |
|
|
188 | (4) |
|
How to use the innerHTML property of the Element interface |
|
|
188 | (2) |
|
How to view the changes to the DOM in Chrome |
|
|
190 | (2) |
|
The Register application with a table |
|
|
192 | (10) |
|
|
192 | (2) |
|
|
194 | (8) |
|
Chapter 7 How to work with links, images, and timers |
|
|
|
How to work with links and images |
|
|
202 | (4) |
|
How to cancel the default action of an event |
|
|
202 | (2) |
|
|
204 | (2) |
|
The Image Swap application |
|
|
206 | (4) |
|
|
206 | (2) |
|
|
208 | (2) |
|
|
210 | (4) |
|
How to use a one-time timer |
|
|
210 | (2) |
|
How to use an interval timer |
|
|
212 | (2) |
|
The Slide Show application |
|
|
214 | (12) |
|
|
214 | (2) |
|
|
216 | (10) |
Section 2 jQuery essentials |
|
|
Chapter 8 Get off to a fast start with jQuery |
|
|
|
|
226 | (4) |
|
|
226 | (2) |
|
How jQuery can simplify JavaScript development |
|
|
228 | (2) |
|
The basics of jQuery programming |
|
|
230 | (8) |
|
How to include jQuery in your web pages |
|
|
230 | (2) |
|
How to code jQuery selectors |
|
|
232 | (2) |
|
How to call jQuery methods |
|
|
234 | (2) |
|
How to use jQuery event methods |
|
|
236 | (2) |
|
The Email List application in jQuery |
|
|
238 | (4) |
|
The user interface and HTML |
|
|
238 | (2) |
|
|
240 | (2) |
|
A working subset of selectors, methods, and event methods |
|
|
242 | (8) |
|
The most useful selectors |
|
|
242 | (2) |
|
|
244 | (2) |
|
The most useful event methods |
|
|
246 | (2) |
|
Other event methods that you should be aware of |
|
|
248 | (2) |
|
Three illustrative applications |
|
|
250 | (12) |
|
The FAQs application in jQuery |
|
|
250 | (2) |
|
The Image Swap application in jQuery |
|
|
252 | (4) |
|
The Image Rollover application in jQuery |
|
|
256 | (6) |
|
Chapter 9 How to use effects and animations |
|
|
|
|
262 | (4) |
|
The jQuery methods for effects |
|
|
262 | (2) |
|
The FAQs application with jQuery effects |
|
|
264 | (2) |
|
A Slide Show application with effects |
|
|
266 | (6) |
|
The user interface, HTML, and CSS |
|
|
266 | (2) |
|
Two ways to code the jQuery |
|
|
268 | (2) |
|
How to stop and start a slide show |
|
|
270 | (2) |
|
|
272 | (10) |
|
How to use the basic syntax of the animate() method |
|
|
272 | (2) |
|
How to chain animate() methods |
|
|
274 | (2) |
|
How to use the delay(), stop(), and finish() methods |
|
|
276 | (2) |
|
How to use easings with effects and animations |
|
|
278 | (2) |
|
How to use the advanced animate syntax and the methods for working with queues |
|
|
280 | (2) |
|
A Carousel application with animation |
|
|
282 | (8) |
|
The user interface, HTML, and CSS |
|
|
282 | (2) |
|
|
284 | (6) |
|
Chapter 10 How to work with forms and data validation |
|
|
|
Introduction to forms and controls |
|
|
290 | (6) |
|
|
290 | (2) |
|
The HTML5 controls for working with forms |
|
|
292 | (2) |
|
The HTML5 and CSS3 features for data validation |
|
|
294 | (2) |
|
How to use jQuery to work with forms |
|
|
296 | (4) |
|
The jQuery selectors and methods for forms |
|
|
296 | (2) |
|
The jQuery event methods for forms |
|
|
298 | (2) |
|
A Validation application that uses JavaScript |
|
|
300 | (8) |
|
The user interface and HTML |
|
|
300 | (2) |
|
Some of the JavaScript for the application |
|
|
302 | (6) |
|
Chapter 11 How to use jQuery plugins and jQuery UI widgets |
|
|
|
Introduction to jQuery plugins |
|
|
308 | (4) |
|
How to find jQuery plugins |
|
|
308 | (2) |
|
How to use any jQuery plugin |
|
|
310 | (2) |
|
How to use three of the most popular plugins |
|
|
312 | (6) |
|
How to use the Lightbox plugin for images |
|
|
312 | (2) |
|
How to use the bxSlider plugin for carousels |
|
|
314 | (2) |
|
How to use the Cycle 2 plugin for slide shows |
|
|
316 | (2) |
|
Introduction to jQuery UI |
|
|
318 | (6) |
|
What jQuery UI is and where to get it |
|
|
318 | (2) |
|
How to download jQuery UI |
|
|
320 | (1) |
|
How to include jQuery UI in your web pages |
|
|
320 | (2) |
|
How to use any jQuery UI widget |
|
|
322 | (2) |
|
How to use five of the most popular jQuery UI widgets |
|
|
324 | (12) |
|
How to use the Accordion widget |
|
|
324 | (2) |
|
How to use the Tabs widget |
|
|
326 | (2) |
|
How to use the Button and Dialog widgets |
|
|
328 | (2) |
|
How to use the Datepicker widget |
|
|
330 | (6) |
|
Chapter 12 How to use Ajax and JSON |
|
|
|
|
336 | (8) |
|
|
336 | (2) |
|
Common data formats for Ajax |
|
|
338 | (2) |
|
The members of the XMLHttpRequest object |
|
|
340 | (2) |
|
How to use the XMLHttpRequest object |
|
|
342 | (2) |
|
How to use the jQuery shorthand methods for Ajax |
|
|
344 | (10) |
|
The jQuery shorthand methods for working with Ajax |
|
|
344 | (2) |
|
How to use the load() method to load HTML data |
|
|
346 | (2) |
|
How to use the $.get() or $.post() method to load XML data |
|
|
348 | (2) |
|
How to use the $.getJSON() method to load JSON data |
|
|
350 | (2) |
|
How to send data with an Ajax request |
|
|
352 | (2) |
|
How to use the $.ajax() method for working with Ajax |
|
|
354 | (4) |
|
The syntax of the $.ajax() method |
|
|
354 | (2) |
|
How to use the $.ajax() method to load data |
|
|
356 | (2) |
|
How to use Ajax with Flickr |
|
|
358 | (16) |
|
How to use the feed API for Flickr |
|
|
358 | (2) |
|
How to display Flickr data on a page |
|
|
360 | (2) |
|
How to review the feed from a website |
|
|
362 | (2) |
|
How to display descriptions for a Flickr photo feed |
|
|
364 | (2) |
|
How to search for photos by tags |
|
|
366 | (8) |
Section 3 Advanced JavaScript skills |
|
|
Chapter 13 How to work with numbers, strings, and dates |
|
|
|
|
374 | (6) |
|
How to use the properties and methods of the Number object |
|
|
374 | (2) |
|
How to use the properties and methods of the Math object |
|
|
376 | (2) |
|
How to generate a random number |
|
|
378 | (2) |
|
|
380 | (4) |
|
|
380 | (2) |
|
|
382 | (2) |
|
|
384 | (4) |
|
How to use the properties and methods of the String object |
|
|
384 | (2) |
|
Examples of working with strings |
|
|
386 | (2) |
|
How to work with dates and times |
|
|
388 | (6) |
|
How to create Date objects |
|
|
388 | (2) |
|
The methods of the Date object |
|
|
390 | (2) |
|
Examples of working with dates |
|
|
392 | (2) |
|
The Count Down application |
|
|
394 | (8) |
|
|
394 | (2) |
|
|
396 | (6) |
|
Chapter 14 How to work with control structures, exceptions, and regular expressions |
|
|
|
What else you need to know about control structures |
|
|
402 | (8) |
|
How to use the equality and identity operators |
|
|
402 | (1) |
|
How to use the break and continue statements |
|
|
402 | (2) |
|
How to use the switch statement |
|
|
404 | (2) |
|
How to use the conditional operator |
|
|
406 | (2) |
|
How to use the AND and OR operators for selections |
|
|
408 | (2) |
|
|
410 | (4) |
|
|
410 | (2) |
|
|
412 | (2) |
|
|
414 | (4) |
|
How to use try-catch statements |
|
|
414 | (2) |
|
How to create and throw Error objects |
|
|
416 | (2) |
|
How to use regular expressions |
|
|
418 | (8) |
|
How to create and use regular expressions |
|
|
418 | (2) |
|
How to match special characters and types of characters |
|
|
420 | (2) |
|
How to match string positions, subpatterns, and repeating patterns |
|
|
422 | (2) |
|
Regular expressions for data validation |
|
|
424 | (2) |
|
The Account Profile application |
|
|
426 | (10) |
|
|
426 | (2) |
|
|
428 | (8) |
|
Chapter 15 How to use browser objects, cookies, and web storage |
|
|
|
How to script browser objects |
|
|
436 | (4) |
|
How to use the location object |
|
|
436 | (2) |
|
How to use the history object |
|
|
438 | (2) |
|
|
440 | (4) |
|
|
440 | (2) |
|
|
442 | (2) |
|
|
444 | (8) |
|
An introduction to cookies |
|
|
444 | (2) |
|
|
446 | (2) |
|
|
448 | (2) |
|
|
450 | (2) |
|
The Task List application |
|
|
452 | (4) |
|
|
452 | (2) |
|
|
454 | (2) |
|
|
456 | (4) |
|
How to use local and session storage |
|
|
456 | (2) |
|
The Task List application with web storage |
|
|
458 | (2) |
|
How to use Chrome to work with items in the browser |
|
|
460 | (6) |
|
How to view and delete cookies |
|
|
460 | (1) |
|
How to view, edit, and delete items in web storage |
|
|
460 | (6) |
|
Chapter 16 How to use arrays |
|
|
|
How to create and use an array |
|
|
466 | (8) |
|
|
466 | (2) |
|
How to add and delete array elements |
|
|
468 | (2) |
|
How to use for loops to work with arrays |
|
|
470 | (2) |
|
How to use for-in loops to work with arrays |
|
|
472 | (2) |
|
How to use the methods of an Array object |
|
|
474 | (6) |
|
Methods that accept simple parameters |
|
|
474 | (2) |
|
Methods that accept functions as parameters |
|
|
476 | (2) |
|
Examples of the Array methods |
|
|
478 | (2) |
|
The Task List application |
|
|
480 | (2) |
|
|
480 | (1) |
|
|
480 | (2) |
|
Other skills for working with arrays |
|
|
482 | (6) |
|
How to use a String method to create an array |
|
|
482 | (2) |
|
How to create and use an associative array |
|
|
484 | (2) |
|
How to create and use an array of arrays |
|
|
486 | (2) |
|
The Task List 2.0 application |
|
|
488 | (10) |
|
|
488 | (2) |
|
|
490 | (8) |
|
Chapter 17 How to create and use your own objects |
|
|
|
Basic skills for working with objects |
|
|
498 | (8) |
|
How to create and use the native object types |
|
|
498 | (2) |
|
How to create your own objects with object literals |
|
|
500 | (2) |
|
How to extend or modify an object |
|
|
502 | (2) |
|
How to create and use JavaScript libraries |
|
|
504 | (2) |
|
The Miles Per Gallon application |
|
|
506 | (4) |
|
|
506 | (2) |
|
|
508 | (2) |
|
How to create and call constructors |
|
|
510 | (4) |
|
How to create your own object types with constructor functions |
|
|
510 | (2) |
|
What else you should know about prototypes |
|
|
512 | (2) |
|
|
514 | (4) |
|
|
514 | (2) |
|
|
516 | (2) |
|
How to create a factory function |
|
|
518 | (4) |
|
How to use the create() method of the Object object |
|
|
518 | (2) |
|
The Trips application with a factory function |
|
|
520 | (2) |
|
Advanced skills for working with objects |
|
|
522 | (8) |
|
How to use the arguments property of a Function object |
|
|
522 | (2) |
|
How to create cascading methods |
|
|
524 | (2) |
|
How to inherit methods from another object |
|
|
526 | (2) |
|
How to use the this keyword |
|
|
528 | (2) |
|
The Task List application |
|
|
530 | (14) |
|
|
530 | (2) |
|
The task and storage libraries |
|
|
532 | (2) |
|
|
534 | (2) |
|
|
536 | (8) |
|
Chapter 18 How to create and use closures, IIFEs, the module pattern, and plugins |
|
|
|
|
544 | (6) |
|
|
544 | (2) |
|
How to use closures to create private state |
|
|
546 | (2) |
|
How to work with the this keyword in closures |
|
|
548 | (2) |
|
The Slide Show application |
|
|
550 | (6) |
|
|
550 | (2) |
|
|
552 | (2) |
|
|
554 | (2) |
|
How to use immediately invoked function expressions |
|
|
556 | (4) |
|
|
556 | (2) |
|
How to use an IIFE to solve the closure loop problem |
|
|
558 | (2) |
|
How to work with the module pattern |
|
|
560 | (4) |
|
What the module pattern is |
|
|
560 | (2) |
|
How to augment a module and use accessor properties |
|
|
562 | (2) |
|
The Slide Show application with the module pattern |
|
|
564 | (6) |
|
|
564 | (2) |
|
|
566 | (2) |
|
The slide show enhancements library |
|
|
568 | (1) |
|
|
568 | (2) |
|
How to use the module pattern to create jQuery plugins |
|
|
570 | (6) |
|
The structure of a plugin |
|
|
570 | (2) |
|
How to code a plugin that highlights the items in a menu |
|
|
572 | (2) |
|
How to add options to a plugin |
|
|
574 | (2) |
|
A Blackjack application that uses a blackjack plugin |
|
|
576 | |
|
The HTML and the main JavaScript file |
|
|
576 | (2) |
|
The deck and hand files of the blackjack plugin |
|
|
578 | (2) |
|
The game file of the blackjack plugin |
|
|
580 | (2) |
|
The main file of the blackjack plugin |
|
|
582 | (2) |
|
How to compress and combine the files for a plugin |
|
|
584 | |