jQuery

Opublikowany przez

Dojrzałość – 2006
Popularność – #1
Wydajność – #2

Charakterystyka

Dziś niewątpliwie najpopularniejsza biblioteka JavaScript, została stworzona w roku 2006 przez Johna Resiga. jQuery jest lekkim frameworkiem ułatwiającym między innymi: cross-browserowe manipulowanie elementami DOM, wysyłanie żądań Ajaxowych oraz obsługę zdarzeń.

Najważniejsze funkcjonalności

  • Selektory – bogata, zgodna z CSS3 składnia umożliwia dostęp do dowolnego elementu DOM.
  • Atrybuty – manipulacja atrybutami została uproszczona dzięki metodzie attr().
  • Obsługa zdarzeń – ujednolicenie interfejsu za pomocą takich metod jak click, select itp…
  • Efekty – najważniejsze funkcje animujące: fadeIn, toggle, slideDown nie wymagają instalacji dodatkowych pluginów.
  • Ajax – przyjazny developerowi interfejs

Filozofia

  • chaining – tam gdzie jest to możliwe, funkcje zwracają obiekt typu jQuery. Umożliwia to łączenie metod w łańcuch:
    $("div.test").add("p.quote").addClass("blue").slideDown("slow");
    
  • przeciążanie metod – w zależności od rodzaju parametrów funkcje zachowują się inaczej. Dobrym przykładem jest funkcja jQuery, która w zależności od przekazanych parametrów może: wyszukiwać elementy, tworzyć nowe elementy lub być prostym callbackiem zdarzenia onload.
    jQuery( selector, [ context ] )
    jQuery( selector, [context] )
    jQuery( element )
    jQuery( elementArray )
    jQuery( jQuery object )
    jQuery()
    jQuery( html, [ ownerDocument ] )
    jQuery( html, [ownerDocument] )
    jQuery( html,props )
    jQuery( callback )
    jQuery( callback )
    
  • własna przestrzeń nazw – W przeciwieństwie do Prototype jQuery nie rozszerza natywnych klas. Co więcej, metody oferowane przez jQuery nie zaśmiecają globalnej przestrzeni nazw, co niewątpliwie mnimalizuje prawdopodobieństwo wystąpienia konfliktów.
  • pluginy – świetny system pluginów pozwala rozszerzać framework o dowolne funkcjonalności.

Przykłady użycia

Wykonanie kodu po załadowaniu strony:

jQuery(document).ready(function() {
//do stuff
});

 

Wyszukiwanie elementów

var myElement = jQuery('#myElement');
var divs = jQuery('div');

 

Tworzenie nowego elementu.

jQuery('<div id="myElement">This is a new element</div>').appendTo('body');

 

Wady i zalety

Zalety

  • Szybki i zgodny z CSS3 system selektorów.
  • Zoptymalizowana manipulacja elementami DOM.
  • Method chaining.
  • Pojedyńcza przestrzeń nazw.

Wady

  • Brak systemu klas.
  • Raczej DOM oriented niż JavaScript Oriented.

Dodaj Komentarz

  • (wymagane)
  • (wymagane, nie będzie opubliowany)

XHTML: Możesz użyć następujących tagów: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>