-
Podam wam podstawowe zasady
korzystania z jQuery na stronie www.
-
Pierwszy krok
– to wprowadzić bibliotekę jQuery
-
przy użyciu znacznika "script".
-
Zanim jednak umieścimy JavaScript
w naszym znaczniku "script",
-
dodam atrybut "src".
-
I muszę to połączyć z jakimś URL-em.
-
Ale z jakim?
-
Gdybym pracowała na własnym komputerze
-
i załadowała jQuery do katalogu,
w którym jest moja strona,
-
mogłabym napisać po prostu "jquery.js".
-
Ale w Khan Academy to nie zadziała.
-
Tu jest mi potrzebny URL jQuery
na jakimś serwerze online.
-
Lista tych URL-ów
znajduje się na stronie jquery.com.
-
Wkleję tu jeden z nich. Gotowe.
-
Chcę zwrócić waszą uwagę
na parę spraw związanych z tym URL-em.
-
Po pierwsze, zaczyna się od "https".
-
To oznacza, że jest bezpieczny.
-
Khan Academy pozwala wam
sprowadzać tylko bezpieczne zasoby.
-
To dobry zwyczaj
w projektowaniu stron!
-
Po drugie, ten URL znajduje się
na serwerze Google: googleapis.com.
-
To serwer systemu CDN
(sieci dystrybucji treści)
-
przystosowany do obsługi plików
statycznych, jak biblioteki JavaScript.
-
Obsługuje te pliki bardzo szybko.
-
Ufam temu serwerowi Google.
-
Zawsze powinniście ufać serwerom,
z których sprowadzacie skrypty,
-
bo ta operacja niesie potencjalne
zagrożenie dla waszej strony.
-
Po trzecie, w tym URL-u
zawiera się numer wersji: 2.1.4.
-
Biblioteka jQuery aktywnie się rozwija.
-
Często powstają nowe wersje.
-
Cyfry po lewej stronie oznaczają
znaczące zmiany wersji,
-
a te po stronie prawej
odnoszą się do wersji mniej istotnych.
-
Ja używam tu biblioteki jQuery2,
-
która współpracuje z nowoczesnymi
przeglądarkami oprócz IE 8.
-
Sami zdecydujcie, której wersji użyjecie
na swojej stronie – zależnie od potrzeb.
-
Dobrze. Mamy już jQuery.
-
Teraz użyjmy tej biblioteki
w innym znaczniku "script".
-
Każda biblioteka JavaScript
wystawia funkcje i nadaje im nazwy.
-
Te nazwy i opis funkcji
znajdziemy w dokumentacji.
-
Biblioteka jQuery daje nam
ważną funkcję
-
o bardzo krótkiej nazwie.
-
To po prostu znaczek dolara.
-
Najpierw piszemy ten znaczek,
-
potem dwa nawiasy
(bo mamy do czynienia z funkcją)
-
i, oczywiście, średnik.
-
Miło, że nazwa funkcji jest krótka,
-
bo będziemy ją przywoływać
bardzo często!
-
Do funkcji możemy wprowadzić
mnóstwo argumentów,
-
ale w moim przykładzie
będzie to po prostu ciąg znaków "h1".
-
Gdy skończę, program każe jQuery
-
znaleźć wszystkie elementy
"h1" na stronie
-
i zwrócić je jako obiekt
z kolekcji jQuery.
-
I teraz mogę przywołać
do obiektu jQuery inne metody,
-
żeby zmieniać wszystkie
znalezione elementy "h1".
-
Chcąc zmienić tekst
wewnętrzny w każdym elemencie,
-
przywołam funkcję "text"
i wprowadzę ciąg znaków.
-
Już się robi! Tak! Gotowe.
-
To nasz pierwszy kontakt z jQuery.
-
Wprowadziliśmy bibliotekę do programu
za pomocą znacznika "script"
-
i kazaliśmy jej znaleźć
wszystkie "h1" na stronie,
-
a potem – zmienić w nich tekst.
-
Oglądajcie kolejne odcinki.
Zagłębimy się w szczegóły,
-
poznamy sposoby wybierania
i modyfikacji elementów,
-
dowiemy się, jak używać jQuery
w reakcji na zdarzenia użytkownika…
-
Będzie też zabawa
przy animacji i efektach.