JavaScript i jQuery : nieoficjalny podręcznik / David Sawyer

JavaScript i jQuery : nieoficjalny podręcznik / David Sawyer McFarland.
– Gliwice, cop. 2013
Spis treści
Nieoficjalna czołówka
11
Wprowadzenie
15
Cześć I. Wprowadzenie do języka JavaScript
33
Rozdział 1. Pierwszy program w języku JavaScript
Wprowadzenie do programowania
Czym jest program komputerowy?
Jak dodać kod JavaScript do strony?
Zewnętrzne pliki JavaScript
Pierwszy program w języku JavaScript
Dodawanie tekstu do stron
Dołączanie zewnętrznych plików JavaScript
Wykrywanie błędów
Konsola JavaScript w przeglądarce Firefox
Wyświetlanie okna dialogowego błędów w Internet Explorerze 9
Konsola błędów w przeglądarce Chrome
Konsola błędów w przeglądarce Safari
35
36
38
38
40
42
45
46
48
48
50
51
51
Rozdział 2. Gramatyka języka JavaScript
Instrukcje
Wbudowane funkcje
Typy danych
Liczby
Łańcuchy znaków
Wartości logiczne
Zmienne
Tworzenie zmiennych
UŜywanie zmiennych
UŜywanie typów danych i zmiennych
Podstawowe operacje matematyczne
Kolejność wykonywania operacji
Łączenie łańcuchów znaków
Łączenie liczb i łańcuchów znaków
Zmienianie wartości zmiennych
Przykład — uŜywanie zmiennych do tworzenia komunikatów
Przykład — pobieranie informacji
55
55
56
56
57
57
58
59
59
62
63
64
65
65
66
67
69
70
Tablice
Tworzenie tablic
UŜywanie elementów tablicy
Dodawanie elementów do tablicy
Usuwanie elementów z tablicy
Przykład — zapisywanie danych na stronie za pomocą tablic
Krótka lekcja o obiektach
Komentarze
Kiedy uŜywać komentarzy?
Komentarze w tej ksiąŜce
72
74
75
76
79
79
82
85
86
87
Rozdział 3. Dodawanie struktur logicznych i sterujących
Programy reagujące inteligentnie
Podstawy instrukcji warunkowych
Uwzględnianie planu awaryjnego
Sprawdzanie kilku warunków
Bardziej skomplikowane warunki
ZagnieŜdŜanie instrukcji warunkowych
Wskazówki na temat pisania instrukcji warunkowych
Przykład — uŜywanie instrukcji warunkowych
Obsługa powtarzających się zadań za pomocą pętli
Pętle while
Pętle i tablice
Pętle for
Pętle do-while
Funkcje — wielokrotne korzystanie z przydatnego kodu
Krótki przykład
Przekazywanie danych do funkcji
Pobieranie informacji z funkcji
Unikanie konfliktów między nazwami zmiennych
Przykład — prosty quiz
89
89
91
94
94
97
99
100
101
104
104
106
107
109
110
112
113
114
116
118
Cześć II. Wprowadzenie do biblioteki jQuery
125
Rozdział 4. Wprowadzenie do jQuery
Kilka słów o bibliotekach JavaScript
Jalc zdobyć jQuery?
Dodawanie jQuery do strony
Podstawowe informacje o modyfikowaniu stron WWW
Zrozumieć DOM
Pobieranie elementów stron na sposób jQuery
Proste selektory
Selektory zaawansowane
Filtry jQuery
Zrozumienie kolekcji jQuery
127
127
129
132
134
138
140
141
143
146
148
Dodawanie treści do stron
Zastępowanie i usuwanie wybranych elementów
Ustawianie i odczyt atrybutów znaczników
Klasy
Odczyt i modyfikacja właściwości CSS
Jednoczesna zmiana wielu właściwości CSS
Odczyt, ustawienia i usuwanie atrybutów HTML
Wykonanie akcji na kaŜdym elemencie kolekcji
Funkcje anonimowe
this oraz $(this)
Automatycznie tworzone, wyróŜniane cytaty
Opis rozwiązania
Kod rozwiązania
149
152
154
154
155
157
159
160
160
162
163
164
165
Rozdział 5. Akcja i reakcja — oŜywianie stron za pomocą zdarzeń
Czym są zdarzenia?
Zdarzenia związane z myszą
Zdarzenia związane z dokumentem i oknem
Zdarzenia związane z formularzami
Zdarzenia związane z klawiaturą
Obsługa zdarzeń przy uŜyciu jQuery
Przykład — wyróŜnianie wierszy tabeli
Zdarzenia specyficzne dla biblioteki jQuery
Oczekiwanie na wczytanie kodu HTML
Zdarzenia biblioteki jQuery
Obiekt reprezentujący zdarzenie
Blokowanie standardowych reakcji na zdarzenia
Usuwanie zdarzeń
Zaawansowane zarządzanie zdarzeniami
Inne sposoby stosowania funkcji bind()
Przykład — jednostronicowa lista FAQ
Omówienie zadania
Tworzenie kodu
169
169
171
172
173
174
174
177
181
182
183
185
186
187
188
189
191
191
192
Rozdział 6. Animacje i efekty
Efekty biblioteki jQuery
Podstawowe wyświetlanie i ukrywanie
Wygaszanie oraz rozjaśnianie elementów
Przesuwanie elementów
Przykład: wysuwany formularz logowania
Tworzenie kodu
Animacje
Tempo animacji
Wykonywanie operacji po zakończeniu efektu
Przykład: animowany pasek ze zdjęciami
197
197
198
200
202
202
203
205
207
209
211
Tworzenie kodu
213
Cześć III. Dodawanie mechanizmów do stron WWW
217
Rozdział 7. Efekty związane z rysunkami
Zamiana rysunków
Zmienianie atrybutu src rysunków
Wstępne wczytywanie rysunków
Efekt rollover z uŜyciem rysunków
Przykład — dodawanie efektu rollover z uŜyciem rysunków
Omówienie zadania
Tworzenie kodu
Przykład — galeria fotografii z efektami wizualnymi
Omówienie zadania
Tworzenie kodu
Wzbogacona galeria z wtyczką FancyBox biblioteki jQuery
Podstawy
Tworzenie galerii zdjęć
Personalizacja efektu FancyBox
Przykład — galeria fotografii oparta na wtyczce FancyBox
219
219
220
221
222
223
224
225
228
228
230
234
235
237
238
244
Rozdział 8. Usprawnianie nawigacji
Podstawowe informacje o odnośnikach
Pobieranie odnośników w kodzie JavaScript
Określanie lokalizacji docelowej
Blokowanie domyślnego działania odnośników
Otwieranie zewnętrznych odnośników w nowym oknie
Tworzenie nowych okien
Właściwości okien
Otwieranie stron w okienku na pierwotnej stronie
Przykład — otwieranie strony na stronie
Animowane menu nawigacyjne
Kod HTML
Kod CSS
Kod JavaScript
Przykład
249
249
249
250
251
252
255
255
259
262
263
264
266
268
268
Rozdział 9. Wzbogacanie formularzy
Wprowadzenie do formularzy
Pobieranie elementów formularzy
Pobieranie i ustawianie wartości elementów formularzy
Sprawdzanie stanu przycisków opcji i pól wyboru
Zdarzenia związane z formularzami
Inteligentne formularze
Aktywowanie pierwszego pola formularza
271
271
273
275
276
277
281
282
Wyłączanie i włączanie pól
Ukrywanie i wyświetlanie opcji formularza
Przykład — Proste wzbogacanie formularza
Aktywowanie pola
Wyłącznie pól formularza
Ukrywanie pól formularza
Walidacja formularzy
Wtyczka Validation
Podstawowa walidacja
Zaawansowana walidacja
Określanie stylu komunikatów o błędach
Przykład zastosowania walidacji
Prosta walidacja
Walidacja zaawansowana
Walidacja pól wyboru i przycisków opcji
Formatowanie komunikatów o błędach
283
284
285
286
286
289
291
293
294
297
302
303
303
305
308
311
Rozdział 10. Rozbudowa interfejsu stron WWW
Organizowanie informacji przy uŜyciu kart
Kod HTML
Kod CSS
Kod JavaScript
Przykład — panel kart
Dodawanie sliderów
Stosowanie slidera AnythingSlider
Przykład — AnythingSlider
Modyfikowanie wyglądu slidera
Modyfikacja działania slidera
Określanie wielkości i połoŜenia elementów strony
Określanie wysokości i szerokości elementów
Określanie połoŜenia elementu na stronie
Uwzględnianie przewinięcia strony
Dodawanie etykietek ekranowych
Kod HTML
Kod CSS
Kod JavaScript
Przykład — etykiety ekranowe
313
314
315
316
319
320
325
326
327
329
332
333
334
337
339
340
340
342
343
344
Cześć IV. AJAX — komunikacja z serwerem sieciowym
355
Rozdział 11. Wprowadzenie do AJAX-a
Czym jest AJAX?
AJAX — podstawy
Elementy układania
Komunikacja z serwerem sieciowym
357
357
360
360
362
AJAX w bibliotece jQuery
UŜywanie funkcji load()
Przykład — korzystanie z funkcji load()
Funkcje get() i post()
Formatowanie danych przesyłanych na serwer
Przetwarzanie danych zwróconych z serwera
Obsługa błędów
Przykład — korzystanie z funkcji get()
Format JSON
Dostęp do danych z obiektów JSON
ZłoŜone obiekty JSON
365
365
368
372
373
376
380
380
386
388
389
Rozdział 12. Flickr oraz Google Maps
Prezentacja JSONP
Dodawanie do witryny kanału Flickr
Tworzenie adresu URL
Stosowanie funkcji $.getJSON()
Prezentacja danych kanału Flickr w formacie JSON
Przykład — dodawanie zdjęć z Flickr na własnej stronie
Wyświetlanie na własnej stronie map Google Maps
Określanie lokalizacji na mapie
Inne opcje wtyczki GoMap
Dodawanie znaczników
Dodawanie okienek informacyjnych do znaczników
Przykład zastosowania wtyczki GoMap
393
393
395
395
398
398
400
404
407
409
411
415
415
Cześć V. Rozwiązywanie problemów, wskazówki i sztuczki
419
Rozdział 13. Wykorzystywanie wszystkich moŜliwości jQuery
Przydatne informacje i sztuczki związane z jQuery
$() to to samo, co jQuery()
Zapisywanie pobranych elementów w zmiennych
Jak najrzadsze dodawanie treści
Optymalizacja selektorów
Korzystanie z dokumentacji jQuery
Czytanie dokumentacji na stronie jQuery
Poruszanie się po DOM
Inne funkcje do manipulacji kodem HTML
Zaawansowana obsługa zdarzeń
421
421
421
422
423
425
426
430
432
438
441
Rozdział 14. Zaawansowane techniki języka JavaScript
Stosowanie łańcuchów znaków
Określanie długości łańcucha
Zmiana wielkości znaków w łańcuchu
Przeszukiwanie łańcuchów znaków: zastosowanie indexOf ()
445
445
446
446
447
Pobieranie fragmentu łańcucha przy uŜyciu metody slice()
Odnajdywanie wzorów w łańcuchach
Tworzenie i stosowanie podstawowych wyraŜeń regularnych
Tworzenie wyraŜeń regularnych
Grupowanie fragmentów wzorców
Przydatne wyraŜenia regularne
Dopasowywanie wzorców
Zastępowanie tekstów
Testowanie wyraŜeń regularnych
Stosowanie liczb
Zamiana łańcucha znaków na liczbę
Sprawdzanie występowania liczb
Zaokrąglanie liczb
Formatowanie wartości monetarnych
Tworzenie liczb losowych
Daty i godziny
Pobieranie miesiąca
Określanie dnia tygodnia
Pobieranie czasu
Tworzenie daty innej niŜ bieŜąca
Łączenie róŜnych elementów
UŜywanie zewnętrznych plików JavaScript
Tworzenie bardziej wydajnego kodu JavaScript
Zapisywanie ustawień w zmiennych
Operator trójargumentowy
Instrukcja Switch
Tworzenie kodu JavaScript o krótkim czasie wczytywania
449
450
451
451
456
456
461
463
464
464
465
467
468
468
469
471
471
472
472
476
477
477
479
479
481
482
484
Rozdział 15. Diagnozowanie i rozwiązywanie problemów
Najczęstsze błędy w kodzie JavaScript
Brak symboli końcowych
Cudzysłowy i apostrofy
UŜywanie słów zarezerwowanych
Pojedynczy znak równości w instrukcjach warunkowych
Wielkość znaków
Nieprawidłowe ścieŜki do zewnętrznych plików JavaScript
Nieprawidłowe ścieŜki w zewnętrznych plikach JavaScript
Znikające zmienne i funkcje
Diagnozowanie przy uŜyciu dodatku Firebug
Instalowanie i włączanie dodatku Firebug
Przeglądanie błędów za pomocą dodatku Firebug
Śledzenie działania skryptu za pomocą funkcji console.log()
Przykład — korzystanie z konsoli dodatku Firebug
Diagnozowanie zaawansowane
Przykład diagnozowania
487
487
488
491
492
493
493
494
494
496
496
497
498
499
500
503
508
Dodatek A. Materiały związane z językiem JavaScript
Źródła informacji
Witryny
KsiąŜki
Podstawy języka JavaScript
Artykuły i prezentacje
Witryny
KsiąŜki
jQuery
Artykuły i prezentacje
Witryny
KsiąŜki
AJAX
Witryny
KsiąŜki
Zaawansowany język JavaScript
Artykuły i prezentacje
Witryny
KsiąŜki
CSS
Witryny
KsiąŜki
515
515
515
516
516
516
516
517
517
517
517
518
518
518
519
519
519
519
520
520
521
521
Skorowidz
525
oprac. BPK