JQuery

jQuery
Logo jQuery
Logo programu
Pierwsze wydanie 2006-08-26 26 sierpnia 2006(dts)
Aktualna wersja stabilna 3.7.1
(28 sierpnia 2023) [±]
Aktualna wersja testowa 4.0.0-beta2
(17 lipca 2024) [±]
Język programowania JavaScript
Rodzaj biblioteka programistyczna
Licencja MIT[1]
Strona internetowa

jQuery – lekka biblioteka programistyczna dla języka JavaScript, ułatwiająca korzystanie z JavaScriptu (w tym manipulację drzewem DOM). Kosztem niewielkiego spadku wydajności w stosunku do profesjonalnie napisanego kodu w niewspomaganym JavaScripcie pozwala osiągnąć interesujące efekty animacji, dodać dynamiczne zmiany strony, wykonać zapytania AJAX. Większość wtyczek i skryptów opartych na jQuery działa na stronach, nie wymagając zmian w kodzie HTML (np. zamienia klasyczne galerie złożone z miniatur linkujących do obrazków w dynamiczną galerię).

Funkcjonalność

jQuery pozwala w wygodny i zrozumiały sposób korzystać z następujących funkcjonalności:

  • selektory – umożliwiają wybranie dowolnego podzbioru węzłów modelu DOM
  • atrybuty – jQuery pozwala przetwarzać atrybuty węzłów dokumentu
  • manipulowanie modelem DOM
  • zmiana i przypisywanie stylu do elementów
  • rozbudowana obsługa zdarzeń, możliwość definiowania własnych
  • efekty – animacje
  • AJAX – prosty interfejs realizujący asynchroniczne zapytania

Podstawowe cechy

  • Niezależność od przeglądarki – eliminuje konieczność dostosowywania kodu do różnych przeglądarek WWW
    • pełna funkcjonalność w: IE 9.0+ (wersja 2.0 usunęła obsługę IE 6,7,8[2]), Firefox 2+, Safari 3.0+, Opera 9.0+, Chrome, Android 4.0+, Safari dla iOS 7+[3]
  • Obsługa selektorów zgodna z CSS3
  • Małe rozmiary – produkcyjna wersja to tylko ok. 30kB (dla skompresowanej wersji 3.4.1)
  • Wygoda tworzenia wtyczek

Użycie

Z biblioteki jQuery można korzystać na dwa sposoby:

  • Użyć funkcji $ lub jQuery ($ jest standardowym aliasem obiektu jQuery). Funkcja ta i inne metody zwracają obiekt jQuery, co oznacza, że można łatwo łączyć je w łańcuch wywołań.
  • Używać $. lub jQuery. jako swoistego prefiksu. Czyli korzystać z metod narzędziowych nie operujących na obiekcie jQuery jako takim.

Typowe wykorzystanie biblioteki jQuery polega na przekazaniu selektora CSS funkcji $, której wynikiem jest tablica referencji do obiektów dopasowanych elementów (tablica może być pusta). Następnie na tej tablicy wykonuje się dodatkowe operacje poprzez metody obiektu jQuery. Na przykład skrypt:

jQuery("div.test").append(jQuery('<p class="quote"/>').addClass('blue').slideDown('slow'));

pobierze tagi DIV z klasą test, doda pusty paragraf o klasie quote, doda klasę o nazwie blue i utworzy animację.

Metody z prefiksem $. lub jQuery. są metodami samodzielnymi lub działają globalnie. Poniższy przykład wykorzysta funkcję mapującą o nazwie each:

jQuery.each([1,2,3], function(klucz, wartosc) {
  document.write(klucz + "=" + wartosc + "<br/>");
});

Przykład powyżej wydrukuje na ekranie: 0=1 1=2 2=3

jQuery oferuje również niezależny od przeglądarki interfejs do synchronicznych oraz asynchronicznych żądań HTTP (AJAX). Standaryzuje on różne implementacje obiektu XMLHttpRequest. Zapytania obsługuje się poprzez metodę globalną jQuery.post lub jQuery.get. Metody te różnią się od siebie tym, że jQuery.post wysyła dane za pomocą POST, a jQuery.get wysyła dane za pomocą GET.

jQuery.post("skrypt.php", {"klucz": "wartość", "a": 13}, function(json) {
    alert("Dane otrzymane: " + json.klucz + ", " + json.a);
}, "json");

W powyższym przykładzie skrypt wyśle żądanie do pliku skrypt.php, przekazując mu parametry klucz i a (w żądaniu typu POST). Po pomyślnym przesłaniu danych wywołana zostanie funkcja przypisana do opcji trzeciej, która w tym wypadku wyświetli komunikat z odpowiedzią zwróconą przez skrypt.

Historia wydań

Data wydania Numer wersji Uwagi
26 sierpnia 20061.0pierwsze wydanie stabilne
14 stycznia 20071.1
10 września 20071.2
14 stycznia 20091.3wprowadzono Sizzle Selector Engine do silnika
14 stycznia 20101.4
31 stycznia 20111.5
3 maja 20111.6znacznie poprawiona wydajność funkcji attr() i val()
3 listopada 20111.7nowe zdarzenia API:.on(),.off()
9 sierpnia 20121.8
15 stycznia 20131.9
24 maja 20131.10
24 stycznia 20141.11
8 stycznia 20161.12
18 kwietnia 20132.0porzucono obsługę przestarzałych przeglądarek Internet Explorer 6-8
24 stycznia 20142.1
8 stycznia 20162.2
9 czerwca 20163.0[4]
7 lipca 20163.1
16 marca 20173.2
20 stycznia 2018 3.3.1
10 kwietnia 2019 3.4.0 funkcja css() działa ze zmiennymi CSS oraz wiele poprawek w funkcjonowaniu biblioteki[5]
1 maja 2019 3.4.1 Drobne poprawki błędów znalezionych w już udostępnionej wersji 3.4.0[6]
28 sierpnia 2023 3.7.1

Przypisy

  1. jQuery Licensing Changes. 2012. [dostęp 2016-09-14]. (ang.).
  2. jQuery 2.0 drops support for old versions of Internet Explorer.
  3. Browser Support. jquery.com.
  4. Long-awaited jQuery 3.0 Brings Slim Build [online], www.infoq.com [dostęp 2017-11-24].
  5. jQuery 3.4.0 Released. blog.jquery.com. [dostęp 2019-06-23].
  6. jQuery 3.4.1: triggering focus events in IE and finding root elements in iOS 10. blog.jquery.com. [dostęp 2019-06-23].

Linki zewnętrzne