Toate JQuery
Și ce înseamnă toate acestea pentru noi dezvoltatori? Cel mai bun mod de a înțelege toate caracteristicile acestei biblioteci pentru a vedea ce trebuie să ne ofere.
Navigarea în documentul HTML
În cazul în care browser-ul face o pagină Web, vom vedea în fața noastră este doar o reprezentare vizuală a unei astfel de lucru ca un DOM (Document Object Model). Acest model poate fi reprezentat conceptual ca un arbore cu noduri, rădăcini și frunze. De exemplu, reprezentarea modelului cu web Pasul de carte Site-ul:
În JQuery puteți naviga cu ușurință prin DOM în căutarea a componentelor, elementele sau valorile necesare pe care doriți să le primiți. Ie dacă sunteți în căutarea DIV cu un text care este dat ID-ul, atunci este foarte simplu.
Dacă doriți să meargă ciclu pentru toate etichetele interval, este de asemenea posibil să se facă:
Cicluri, ne aruncăm o privire mai atentă în secțiunea următoare, în cazul în care vom arăta unele funcționalități suplimentare pentru manipularea paginii. Acestea sunt exemple simple, dar codul poate deveni mult mai dificil, mai ales dacă folosiți metode de cuplare. De exemplu:
În acest stadiu, nu înțelegi ce se întâmplă în codul de mai sus, dar codul este de a vă arăta cum JQuery poate fi utilă în anumite situații atunci când se utilizează funcții auxiliare și metode de cuplare.
Este suficient să menționăm faptul că puterea JQuery constă în capacitatea sa de a face solicitări în DOM (de unde și numele JQuery) și efectuați următoarele modificări cu ajutorul unui API bine prescris (care abundă în exemple de utilizare a funcțiilor).
Cineva ar putea spune că restul funcționalității se bazează pe abilitatea celor de mai sus. Amintiți-vă acest lucru, și va continua să se ocupe în bibliotecă.
Manipulări cu documente HTML
Dacă vorbim despre manipularea reală DOM în funcționalitate extinsă JQuery, cu care puteți schimba ceea ce văd utilizatorii.
Unele dintre caracteristici sunt destul de simple, cum ar fi spectacol și să se ascundă, cu care vă puteți afișa și ascunde elemente care nu ar trebui să fie vizibile pe pagină. Cu ajutorul altor funcții, puteți crea elemente noi și lipiți-le înainte de închiderea unui element existent (funcția de adăugare) sau pentru a introduce tag-uri noi după eticheta de deschidere a unui element (Prepend funcție) existentă. Adăugați o clasă la toate elementele de durata poate fi printr-un ciclu:
Aceasta este doar o mică parte din ceea ce se poate face cu DOM în JQuery. Dacă te duci la un site web API, manipulare în conformitate cu secțiunea puteți vedea lista completă a celor disponibile manipulate (precum și exemple de bune). Putem:
Setați înălțimea și lățimea întregului document, o fereastră sau un singur element
Obține valori element dat (dacă are)
Si mult mai mult
Nu uitați că mulți dezvoltatori aleg JQuery, deoarece pe deplin funcțiile cross-browser și exemple pe care le au în vedere astăzi în articolul nostru.
Prelucrare eveniment
Ie atunci când un utilizator face clic pe un element, apăsați, sau pur și simplu faceți clic pe mouse-ul, browser-ul generează un semnal cauzat de eveniment. În acest fel, în limba de evenimente interactive sunt gestionate de browser.
De fiecare dată când utilizatorul face ceva la o pagină web, putem răspunde la ea cu ajutorul unui eveniment personalizat. Problema este că nu toate browserele sunt în mod egal îndeplinesc același eveniment (din acest motiv, au nevoie de caietul de sarcini, dar asta e pentru un alt articol).
Din fericire, în JQuery toate numele atribuite numele speciale prin care ne putem ocupa de toate evenimentele în toate browserele în mod egal.
La momentul JQuery în rețea a fost destul de popular cu animatia Flash. Dar când vorbim despre animație, efectele JQuery și sunt diferite de cele care au fost în tehnologia veche. Sub animația în JQuery se înțelege că un efect, atunci când utilizatorii se simt feedback-ul de la incidentul de pe ecran. În plus, noua animație nu este la fel de agresiv și poate face o pagină sau o aplicație de stil atunci când sunt utilizate în mod corespunzător (dar nu-l abuzeze).
Link-ul puteți vedea toate API efecte. Trebuie remarcat faptul că, în JQuery efecte variază de la aparențe simple de prelucrare netede și dispariții de elemente sau diapozitive la manipulare mai complexe de mai multe lucruri cum ar fi efectele agățate peste elementul.
În acest din urmă caz vom presupune o anumită experiență cu API-ul, care vine treptat atunci când se lucrează cu bibliotecile și documentația.
Pentru cei care nu sunt familiarizați cu Ajax: folosind pagina web Ajax poate face cereri la server, proces de răspuns și să actualizeze o parte a paginii, fără o renovare completă. Tehnologia nu este nouă, dar încă o treabă bună cu responsabilitățile lor. În Ajax au caracteristici foarte bune care pot fi utile atunci când sunt utilizate în mod corect.
Suport de la Ajax are mult mai bine decât acum 5 ani, dar punerea în aplicare API poate fi încă ușor diferite în diferite browsere. Ie avem nevoie pentru a scrie cod Ajax pentru browsere de la Microsoft, Google, Apple, Chrome, etc. separat.
Fara JQuery ne-ar trebui să scrie cod pentru toate browserele, dar datorită JQuery vom obține modul de browser. De fapt, biblioteca facilitează GET și POST procesarea cererilor și mai multe interogări avansate se poate face printr-o metodă $ .ajax. Odată ce te obișnuiești cu acest API în aplicațiile dvs., nu puteți face fără ea.
Un pic despre scalabilitate
O posibilitate, care este în cadrele de server-side și biblioteci, este posibil să se creeze extensii la codul standard de. Toate bibliotecile client moderne și cadre au o astfel de oportunitate, iar JQuery nu este o excepție.
De exemplu, se lucrează într-o anumită zonă și a crea aceeași funcționalitate pentru aplicații. Sau aveți un produs pe care le vinde, și aveți un cod care trebuie să fie integrate în JQuery, dar va avea nevoie de setări diferite pentru diferite proiecte. Ce să faci atunci?
Din fericire pentru noi în JQuery sprijinit plugin-uri. Ie noi, ca dezvoltatorii nu pot doar alege dintr-o listă de gata făcute de plug-in-uri (unele dintre ele pot fi găsite pe GitHub jQuery și on-line), dar putem și să le scrie.
Putem reutiliza codul în alte proiecte, sau puteți plasa codul de pe site-uri, cum ar fi GitHub, astfel încât alți utilizatori pot face modificări codului, pentru a îmbunătăți, caracteristici suplimentare, etc.
Alte proiecte JQuery
De la lansarea sa JQuery a crescut în ceva mai mult decât o bibliotecă JS, cu care puteți face atât cod simplu și complex, pentru funcționarea funcțională în toate browserele.
În plus față de biblioteca de bază JQuery, există alte două provocări ale proiectului, care ar trebui să-ți spun un pic înainte de a termina acest articol. Nu vom intra în detalii cu privire la oportunitățile de proiect, dar uita doar superficial la fiecare proiect, în scopul de a ști că el ne poate oferi.
Din pagina de start jQuery UI: «JQuery UI - set gata de interacțiuni, efecte, widget-uri, și interfața cu utilizatorul bazată pe cea mai recentă versiune de biblioteci JQuery, JS. JQuery UI este excelent pentru crearea de aplicații web ca extrem de interactive sau pentru a adăuga pur și simplu un selector de dată. "
Cele mai multe widget-uri cu ajutorul funcțiilor comune. De exemplu:
Elementele de selectare a datei
De asemenea, există caracteristici avansate, cum ar fi efectele, utilitatea și interacțiune. În cunoștințele noastre (și ceea ce noi nu știm) în momentul format din toate tipurile de funcții de apel invers, atribute și caracteristici care ne permit să interacționeze cu obiecte.
Toate caracteristicile de mai sus sunt disponibile într-o varietate de subiecte pentru a se potrivi funcționalitatea site-ul dumneavoastră. În plus, toate descrise în lucrare și funcțiile online sunt bine documentate.
JQuery Mobile
Două biblioteci anterioare ne oferă o caracteristici cross-platform, cu care este relativ ușor să scrie și widget-uri JQuery în jQuery Mobile include, de asemenea, un cadru CSS cu care puteți crea, de asemenea, interfețe de utilizator, care sunt ideale pentru proiectele noastre.
Cadrul include:
temă implicită
Biblioteca oferă tot ce v-ați aștepta de la un proiect care vizează atenuarea dezvoltarea web pentru diverse dispozitive mobile. Printre caracteristicile sale:
Evenimente care rulează pe toate dispozitivele
Proprietățile paginii activă
Widget-uri pentru interfete mobile
În plus, rețeaua este încă pe deplin potrivit pentru această tehnologie de browser. Am văzut deja în declin cota de Internet Explorer versiunile mai vechi ale browserului Chrome și salt în popularitate, dar există încă utilizatori care sunt în afara de browsere mai vechi pentru un motiv sau altul.
Toate acestea nu contează, JQuery Mobile suporta cele mai multe browsere existente și sisteme de operare. Dacă nu sunteți sigur de sprijinul platformei ales, îl puteți vedea pe pagina de suport.
concluzie
Dacă acest lucru nu este suficient, există o mare documentare și open source. De asemenea, există mai multe plug-in-uri, precum și blog-ul de proiect care să fie conștienți de toate cele mai recente știri cu privire la dezvoltarea bibliotecii.
Revizie: Echipa webformyself.
Cele mai multe știri IT si dezvoltare web pe canalul nostru-Telegram