jQuery: Ce şi de ce?


Ultimele două articole despre jQuery au intrat destul de mult în această librărie JavaScript pentru ca următoarele rânduri să aibă mai mult sens, dedus deja dintr-o practică. În iunie 2007 a apărut la Pakt Publishing cartea "Learning jQuery", avându-i ca autori pe Jonathan Chaffer şi Karl Swedberg. La începutul cărţii lor, cei doi fac o interesantă analiză despre jQuery, dar am preferat să nu încep cu ea, ci cu ceva exemple practice. Acum însă cred că următoarele idei vor fi din start mai clare. Voi traduce & sintetiza două subcapitole ale cărţii, care mi s-au părut importante.

img556

Ce face jQuery?

– Accesează părţi din pagină. După cum vom vedea într-unul din materialele următoare, jQuery oferă mecanisme foarte elegante de traversare a elementelor unei pagini. De fapt am văzut deja cum cu un script de câteva linii am accesat toate linkurile dintr-o pagină ataşându-le anumite comportamente.

– Modifică aspectul unei pagini. Ştim (cei mai mulţi) puterea CSS pentru a face o pagină mai frumoasă. Cu jQuery puterile cresc, existând atât avantaje relativ la clasica problemă a afişării identice de la un navigator la altul, dar şi posibilitatea de a schimba unele proprietăţi dinamic, după ce pagina s-a încărcat deja (vezi chiar articolul anterior)!

– Modifică conţinutul unei pagini. jQuery nu se limitează la a ne oferi doar schimbări cosmetice (a se citi: de CSS), ci poate să modifice chiar conţinutul documentului. Poate fi schimbat un text, modificată o imagine, reordonată o listă ş.a.m.d.

– Răspunde la interacţiunea utilizatorului cu pagina. Oricât de impresionante ar fi comportamentele ce le asigură o librărie (ex: fadeIn, slideIn) ele devin zero dacă nu pot fi ataşate unor evenimente. Din fericire jQuery are definite o serie de evenimente care interceptează acţiunile vizitatorului într-o pagină web (click, mouseOver ori chiar mişcarea mouse-ului şi altele).

– Adaugă animaţie paginilor. Am văzut deja unele mici animaţii, dar cu ajutorul unor pluginuri aceste animaţii pot fi mult mai complexe şi mai arătoase (vom vedea, nu aveţi grijă!).

– Primeşte informaţie de la server fără încărcarea paginii. Desigur vorbim de Asynchronous JavaScript and XML (AJAX) şi familia lui de derivate. Cu jQuery este chiar uşor să realizezi webaplicaţii care trimit sau primesc date de la server chiar din pagina curentă.

– Simplifică munca cu JavaScript. Prin ceea ce librăria include de-a gata (inclusiv la capitolul iteraţie şi array-uri), jQuery uşurează munca webdeveloperilor.

De ce jQuery este bun?

– Nu se inventează lucruri noi: pentru accesarea elementelor unei pagini jQuery merge pe aceeaşi idee cu CSS. Cine cunoaşte sintaxa CSS ştie deja o bună parte din jQuery (despre cunoaşterea JavaScript nu mai vorbim fiind evidentă, jQuery fiind o librărie JavaScript).

– Arhitectura jQuery permite extinderea funcţionalităţii prin pluginuri. Gândiţi-vă la Firefox: de ce este atât de minunat? Pentru că are un "corp" solid pe care îl completăm cu ce extensii dorim. Dacă Firefox ar cuprinde toate extensiile din lume (pentru a satisface gusturile tuturor) atunci ar avea câteva sute de mega şi probabil ar ocupa 1GB memorie RAM. jQuery merge pe aceeaşi idee: oferă un fundament solid, iar nevoile particulare se rezolvă prin pluginuri. Ne vom ocupa pe larg de ele în articole viitoare.

– O realitate tristă, cunoscută de webdeveloperi, este că principiul "atâtea bordeie, atâtea obiceie" îşi are o replică şi în spaţiul navigatoarelor. Ce merge perfect în Firefox poate scârţâi în Internet Explorer sau Opera, şi invers. Lucrând cu jQuery delegăm o parte din munca noastră, folosind funcţii care au fost atent scrise tocmai pentru compatibilitatea între navigatoare. Lucrul cu jQuery = mai puţină bătaie de cap.

– jQuery lucrează mereu pe seturi. Am văzut că atunci când am ataşat un comportament tagului a acesta a fost automat aplicat tuturor linkurilor. Nu este nevoie de iteraţie în jQuery, aceasta fiind implicită pe setul definit. Desigur, aceasta nu înseamnă că nu poţi aplica un efect doar pe un element: trebuie doar să defineşti un set cu acel unic element (am văzut cum: de exemplu apelând la id=cevaunic).

– În fine, jQuery are acea proprietate numită chainability, adică legarea în lanţ a unor acţiuni, ceea ce permite să scrii o serie de acţiuni într-o singură linie. Aceasta înseamnă că nu mai trebuie să păstrezi o valoare pe care să o predai următoarei acţiuni, ci le pui ca într-o succesiune de ţevi, una preluând ce "scoate" cealaltă.

Cam acestea ar fi ideile (adaptate, repet – nu practic traduceri 100%, ci prefer sintetizarea şi repovestirea) celor două capitole. Sunt sigur că acum unele lucruri sunt mult mai clare şi sunteţi poate mai motivaţi să continuăm călătoria cu jQuery. Pe mâine (probabil – căci, repet, nu sunt acasă şi mă chinui cu o conexiune dial-up)!


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (3 evaluări, media: 5,00 din 5)
Loading...Loading...

4 comentarii

  1. jürgen.toth spune:

    Foarte pe inteles explicat! Astazi am citit cele trei articole si am incercat si eu niste chestii cu jquery. E loc de mai bine :). Cum vrea intamplarea am dat tot astazi de o mult mai mica, dar totusi interesanta prezentare despre jquery: http://www.slideshare.net/simon/jquery-in-15-minutes
    Si parca si in WordPress se foloseste jquery, sau doar in cateva plugin-uri? Nu imi amintesc exact acum, insa ideea e geniala: schimbari mari cu linii mici de cod! Super.
    Mersi de tutorial, de munca depusa pentru cercetare si scriere. Eu prefer arhivele exemplificatoare, cu exemple de coduri unor videotutoriale, care se incarca greu si trebuie scris totul din nou.

  2. pufosu spune:

    Buna ziua. Apropo de jQuery am si eu o problema cu acest program script sau ce este el… In consola de erori imi apare o chestie cum jQuery is not defined si inca o eroare $j is not defined… Si din cauza aceasta nu pot vedea diferite chesti pe un site de vanzari si cumparari… Nu ma lasa sa dau comenzi pe site de cumparare si multe alte… Care este problema???

  3. Pintilie Dana spune:

    Buna seara!
    M-ar interesa și pe mine mai multe aspecte legate de jQuery,cum ar fi:
    -De ce folosim jQuery și nu altceva?
    -selectori
    -link-uri deschise in alta fereastra
    -icon-uri pentru fisiere
    -event-uri
    -firebug.
    Va multumesc!


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *