Príklad jQuery. Jednoduché príklady skriptov jQuery

jQuery je knižnica javascript, ktorá umožňuje vývojárom webových stránok pridávať na svoje webové stránky ďalšie funkcie. Je to open source a poskytuje sa bezplatne podľa licencie MIT. V posledných rokoch sa jQuery stala najvyhľadávanejšou knižnicou javascript používanou pri vývoji webových aplikácií.

Príklad jQuery

Na implementáciu jQuery musí webový vývojár odkazovať na súbor javascript v HTML webovej stránky. Niektoré webové stránky majú svoju vlastnú lokálnu kópiu, zatiaľ čo iné sa jednoducho odvolávajú na knižnicu, ktorú hosťuje spoločnosť Google alebo server. Napríklad webová stránka môže načítať knižnicu jQuery pomocou nasledujúceho riadku v sekcii HTML (príklad jQuery a cookie):


Príklady jQuery a Ajax

Po stiahnutí knižnice môže webová stránka zavolať akúkoľvek funkciu podporovanú knižnicou. Bežné príklady zahŕňajú zmeny textu, spracovanie údajov formulárov, presúvanie položiek na stránke a vykonávanie animácií. jQuery môže pracovať aj s kódom Ajax a skriptovacími jazykmi, ako sú PHP a ASP, na prístup k údajom z databázy. Pretože jQuery je vykonávané na strane klienta (a nie na webovom serveri), môže aktualizovať informácie na webovej stránke v reálnom čase bez opätovného načítania stránky. Bežným príkladom je automatické dopĺňanie, pri ktorom vyhľadávací formulár automaticky zobrazí všeobecné údaje pri zadávaní dopytu.

Výhody knižnice

Okrem bezplatnej licencie je ďalším hlavným dôvodom, prečo jQuery získala takú popularitu.Kompatibilita s viacerými prehliadačmi. Vzhľadom na to, že každý prehliadač zobrazuje HTML, CSS a javascript rôznymi spôsobmi, môže byť pre webového vývojára ťažké vytvoriť webové stránky rovnaké vo všetkých prehliadačoch. Namiesto písania užívateľom definovaných funkcií pre každý prehliadač môže webový vývojár použiť jednu funkciu jQuery, ktorá bude fungovať v prehliadačoch Chrome, Safari, Firefox a Internet Explorer. Podpora pre viacero prehliadačov prinútila mnoho vývojárov prejsť zo štandardného jazyka javascript na jQuery, pretože to značne zjednodušuje proces kódovania.


Popis

Syntax jQuery slúži na zjednodušenie navigácie dokumentov, výber prvkov DOM, vytváranie animácií, udalosti procesu a vývoj aplikácií Ajax. jQuery tiež poskytuje vývojárom možnosť vytvárať doplnky cez knižnicu javascript. To umožňuje programátorom vytvárať abstraktné návrhy pre interakcie a animáciu na nízkej úrovni, pokročilé efekty a tematické widgety na vysokej úrovni. Modulárny prístup k knižnici jQuery umožňuje vytvárať silné dynamické webové stránky a webové aplikácie. Súbor základných funkcií:
  • voľba prvkov DOM;
  • obtok a manipulácia prostredníctvom mechanizmu výberu;
  • nový programovací štýl;
  • Algoritmy fúzií a štruktúry údajov DOM.
  • Štýl ovplyvnil architektúru iných rámcov javascript, ako napríklad YUI v3 a Dojo, a tiež stimuloval vytvorenie štandardných programátorov API.
    Spoločnosti Microsoft a Nokia poskytujú jQuery na svojich platformách. Spoločnosť Microsoft ju zahŕňa s programom Visual Studio pre použitie v rámci ASP.NET AJAX a ASP.NET MVC a spoločnosť Nokia ju integruje do platformy sprievodcu vývojom webových aplikácií.

    Recenzia

    jQuery je knižnica prvkov s dokumentom objektového modelu (DOM). DOM je reprezentácia stromovej štruktúry všetkých prvkov webovej stránky. jQuery zjednodušuje syntax pre vyhľadávanie, výber a správu týchto domén. Knižnica môže byť použitý pre vyhľadávanie položiek v dokumente s určitými vlastnosťami (napr všetky položky so štítkom h1), zmeniť jeden alebo viacero atribútov (farba, viditeľnosť) alebo prijatie odozvy na udalosti (napríklad kliknutí myšou).

    vývoj

    Knižnica využíva populárnych funkcií javascript, ako fade in a fade outy zakrývacieho animáciu a pracujú s prvkami jQuery CSS. jQuery tiež poskytuje paradigma pre spracovanie udalostí, ktorá presahuje rámec výberu a manipuláciu s prvkami DOM. Priradenie udalosti a definovanie funkcie spätného volania sa vykonáva v jednom kroku na jednom mieste v kóde. Princípy využívajúce jQuery (príklady)
  • Oddelenie javascript a HTML - knižnica poskytuje jednoduchú syntax pre pridanie rutiny udalostí DOM pomocou JavaScriptu, namiesto pridávanie HTML atribútov udalosti volanie funkcie JS. Vyzýva preto vývojárov, aby úplne oddelili kód JavaScriptu od označenia HTML.
  • stručnosť a prehľadnosť - podporuje stručnosť a prehľadnosť nástrojov, ako sú reťaze a zníženie názvy funkcií.
  • Eliminácia cross-browser nekompatibilitu - JavaScriptu motory rôzne prehliadače sú mierne odlišné, takže JS kód, ktorý pracuje na jednom prehliadači, nemusí fungovať pre iný. Rovnako ako ostatné nástroje javascript, všetky tieto vlastnosti spravuje jQuerynezrovnalostí medzi rôznymi prehliadačmi a poskytuje konzistentné rozhranie, ktoré funguje v rôznych prehliadačoch.
  • Rozšíriteľnosť - nové udalosti, prvky a metódy sa dajú ľahko pridať a potom použiť ako doplnok.
    História
    jQuery bol pôvodne prepustený v januári 2006 na BarCamp NYC John Reshig a bol ovplyvnený skorou knižnicou CSSQuery Deana Edwardsa. V súčasnosti ho podporuje tím vývojárov spoločnosti Timmy Willison (s jQueryovým selektorom, Sizzle, riadeným Richardom Gibsonom).

    Funkcie

    Knižnica obsahuje nasledujúce funkcie:
  • výber prvkov DOM pomocou multi-serverového mechanizmu voliča s open source Sizzle;
  • Výber projektu manipulácie DOM selektora CSS, ktorý používa názvy a atribúty prvkov ako id, triedu ako kritériá pre výber uzlov DOM;
  • opatrenie;
  • animačné efekty;
  • ajax;
  • objekty sú oneskorené a sľubujú, že kontrolujú asynchrónne spracovanie;
  • analýza JSON;
  • Rozšíriteľnosť prostredníctvom zásuvných modulov;
  • nástroje, ako napríklad detekcia funkcií;
  • metódy kompatibility, ktoré sú pôvodne dostupné v moderných prehliadačoch, ale vyžadujú staršie verzie, ako napríklad inArray () a každý (), multi-browser (nesmú byť zamenené s krížovým prehliadačom).
    Použitie
    Knižnica jQuery je jediný súbor javascript, ktorý obsahuje všetky bežné funkcie DOM, udalosti, efekty a Ajax. Môže byť zahrnutá na webovej stránke prepojením na lokálnu kópiu alebo na jednu z mnohých kópií dostupných pre verejnosťservery. Knižnica má sieť na poskytovanie obsahu (CDN), ktorú hosťuje max-cdn. JQuery PHP Príklad:

    štýly

    jQuery má dva štýly použitie: $ funkcie
  • A, ktorý je predmetom výroby spôsob jQuery. Tieto funkcie, často nazývané príkazy, sú celé čísla, pretože všetky vrátia objekty jQuery.
  • ​​
  • Prostredníctvom funkcií $ - prefix. Toto sú servisné funkcie, ktoré priamo neovplyvňujú objekt.
  • Prístup k JQuery a spravovanie viacerých uzlov DOM obvykle začína volaním funkcie $ pomocou riadka voliča CSS. Tým sa vracia objekt jQuery, ktorý odkazuje na všetky relevantné prvky na stránke HTML.

    bezkonfliktný režim

    jQuery zahŕňa režim .noConflict (), ktorá vyníma funkcie riadenia $. Je to užitočné, ak sa jQuery používa s inými knižnicami, ktoré tiež používajú $ ako identifikátor. V režime bez konfliktu môžu vývojári používať knižnice ako náhradu za 2 doláre bez straty funkčnosti.

    Všetky funkcie

    Funkcia spätného volania pre spracovanie udalostí v bunkách, ktoré neboli doteraz stiahnuté, môžu byť registrovaná v .ready (), ako je anonymný funkcie. Títo obsluhujúci pracovníci budú volaní iba vtedy, keď sa udalosť spustí. Napríklad nasledujúci kód pridáva handler pre kliknutí myšou na obrázok prvok img :. $ (Function () {$ ('img') On ('cvaknutie', function () {//proces akcia kliknite na ľubovoľný prvok na stránke img });}). Niektoré funkcie vracajú určité hodnoty (napríklad $ ('# input-user-email')) Val ()). V týchto prípadoch reťaz nefunguje, pretože hodnota neodkazuje na objekt jQuery.

    Vytváranie novýchprvky

    Okrem prístupu k DOM uzly cez hierarchiu objektov, to je tiež možné vytvárať nové položky v prípade, že reťazec odovzdaný ako parameter $ () vyzerá ako HTML. Napríklad výber riadková položka je HTML s identifikačnými kartami a pridáva prvok s hodnotou opcií a textové VAG Volkswagen: $ ('# zvoľte carmakes') .append ($ ('') .attr ({value: VAG} .append) (Volkswagen )).

    Nástroje

    Funkcie jQuery s predponou $ sú utilitné funkcie, ktoré ovplyvňujú globálne vlastnosti a správanie. V nasledujúcom príklade je funkcia každej (), ktorý vykonáva iteráciu cez pole: .each $ ([1,2,3], funkcia () {console.log (to + 1);}); Tento príklad post jQuery zapíše do konzoly 234.

    Ajax

    je možné vykonávať naprieč prehliadači žiadostí Ajax pomocou $ .ajax () jQuery, ktorý môže slúžiť ako príklad súvisiacich metód pre nahrávanie a spracovanie dát odstránený: $ .ajax ({symbol: POST, url: ' /process/submit.php 'údaje {názov: umiestnenie John:' Boston '}}) hotovo (funkcia (MSG) {alert. (' dáta uložené:, + MSG).}) zlyhanie (function (XMLHttpRequest, statusText, errorThrown) {alert ('nepodarilo odoslať povidomlennya.Nn' + 'XML HTTP požiadavky:' + JSON.stringify (XMLHttpRequest) + 'nStatus text:' + statusText + ', nChyba Thrown: '+ errorThrown};}); V tomto príklade je názov servera zadaný data = Johna a umiestnenie = Bostone /process/submit.php. Keď je táto požiadavka dokončená, funkcia sa vyzve na upozornenie používateľa. Ak žiadosť zlyhá, upozorní používateľ na chybový stav žiadosti a konkrétnu chybu.

    Pluginy

    Architektúra jQuery umožňuje vývojárom vytvárať vlastný kód na rozšírenie rôznych funkcií. Internet je k tisícom ďalších modulov, ktoré pokrývajú širokú škálu funkcií, ako je k dispozíciiAjax pomocníci, webové služby, dynamické zoznamy, nástroje XML a XSLT, drag and drop, udalosti, spracovanie súborov cookie a modálne okná. Existujú alternatívne plug-iny pre vyhľadávačov, ako je jquer.in pomocou viacerých špecializovaných prístupov, ako je prenos iba plug-iny, ktoré spĺňajú určité kritériá (napríklad tí, ktorí majú spoločné úložisko kódu). Developer má "Learning Center" - jQuery zdroj pre začiatočníkov, ktoré môžu pomôcť používateľom porozumieť javascript a začať rozvíjať plug-inov.

    jQuery UI

    jQuery UI widget je sada rozhranie, animované vizuálne efekty a tie implementovaný pomocou jQuery CSS (javascript knižnicu), kaskádové štýly a HTML. Podľa spravodajských služieb JavaScriptu, Libscore, jQuery UI používa na viac než 197,000 špičkové webové stránky, čo je druhý najpopulárnejší knižnice JS. Najznámejšie sú Pinterest, PayPal, IMDb, The Huffington Post a Netflix.
    Užívateľské rozhranie jQuery je bezplatná a open source nadácia, licencovaná spoločnosťou MIT. To bolo prvýkrát zverejnené v septembri 2007.

    jQuery Mobile

    jQuery Mobile - webová infraštruktúra s dotykovým optimalizácie (tiež známy ako mobilné infraštruktúry). Ťažisko vývoja na vytvorenie infraštruktúry, ktorá je kompatibilná s celou radou inteligentných telefónov a tabletových počítačov potrebných pre rastúci trh digitálnej techniky. Je kompatibilný s inými platformami mobilných aplikácií, ako je PhoneGap, Worklight a mnoho ďalších.

    Súvisiace publikácie