Příklad jQuery. Jednoduché příklady skriptů jQuery

jQuery je knihovna javascript, která webovým vývojářům umožňuje přidávat na své webové stránky další funkce. Je otevřeným zdrojem a poskytuje se bezplatně podle licence MIT. V posledních letech se jQuery stala nejvyhledávanější knihovnou javascript používanou při vývoji webových stránek.

Příklad jQuery

Pro implementaci jQuery musí webový vývojář odkazovat na soubor javascript v HTML webové stránky. Některé webové stránky mají vlastní lokální kopii, jiné se prostě odkazují na knihovnu hostovanou společností Google nebo serverem. Například webová stránka může načíst knihovnu jQuery pomocí následujícího řádku v sekci HTML (jQuery a příklad cookie):


Příklady jQuery a Ajax

Po stažení knihovny může webová stránka volat libovolnou funkci podporovanou knihovnou. Mezi běžné příklady patří změny textu, zpracování dat formuláře, přesouvání položek na stránce a provádění animací. jQuery může také pracovat s kódem Ajax a skriptovacími jazyky, například PHP a ASP, pro přístup k datům z databáze. Vzhledem k tomu, že je jQuery spuštěn na straně klienta (a nikoliv na webovém serveru), může aktualizovat informace na webové stránce v reálném čase bez opětovného načtení stránky. Obvyklým příkladem je automatické dokončování, ve kterém vyhledávací formulář automaticky zobrazí obecná data při zadávání dotazu.

Výhody knihovny

Kromě volné licence je dalším hlavním důvodem, proč jQuery získala takovou popularitu, jejíKompatibilita mezi prohlížeči. Vzhledem k tomu, že každý prohlížeč zobrazuje HTML, CSS a javascript různými způsoby, může být pro webového vývojáře obtížné vytvořit webové stránky stejně ve všech prohlížečích. Namísto psaní vlastností definovaných uživatelem pro každý prohlížeč může vývojář webu používat jednu funkci jQuery, která bude fungovat v prohlížečích Chrome, Safari, Firefox a Internet Explorer. Podpora pro více prohlížečů přiměla mnoho vývojářů k přepnutí ze standardního javascriptu na jQuery, protože to značně zjednodušuje proces kódování.


Popis

Syntaxe jQuery se používá pro zjednodušení navigace dokumentů, výběr prvků DOM, vytváření animací, procesních událostí a vývoj aplikací Ajax. jQuery také poskytuje vývojářům možnost vytvářet plug-iny přes knihovnu javascript. To umožňuje programátorům vytvářet abstraktní návrhy interakcí a animací na nízké úrovni, pokročilé efekty a tematické widgety na vysoké úrovni. Modulární přístup k knihovně jQuery vám umožňuje vytvářet výkonné dynamické webové stránky a webové aplikace. Soubor základních funkcí:
  • výběr prvků DOM;
  • Obtok a manipulace pomocí volitelného mechanismu;
  • nový programovací styl;
  • Algoritmy fúzí a datové struktury DOM.
  • Styl ovlivnil architekturu jiných rámců javascript, jako jsou například YUI v3 a Dojo, a také stimuloval vytvoření standardního rozhraní API Selectors.
    Microsoft a Nokia poskytují jQuery na svých platformách. Společnost Microsoft jej zahrnuje s aplikací Visual Studio pro použití v ASP.NET AJAX a ASP.NET MVC a Nokia ji integruje do platformy průvodce vývojem webů.

    Recenze

    jQuery je knihovna prvků s dokumentem objektového modelu (DOM). DOM je reprezentace stromové struktury všech prvků webové stránky. jQuery zjednodušuje syntaxi pro vyhledávání, výběr a správu těchto domén. Knihovna může být použit pro vyhledávání položek v dokumentu s určitými vlastnostmi (např všechny položky se štítkem h1), změnit jeden nebo více atributů (barva, viditelnost) nebo přijetí odezvy na události (například klepnutí myší).

    vývoj

    Knihovna využívá populárních funkcí javascript, jako fade in a fade outy zakrývacího animaci a pracují s prvky jQuery CSS. jQuery také poskytuje paradigma pro zpracování událostí, která přesahuje rámec výběru a manipulaci s prvky DOM. Přiřazení události a definování funkce zpětného volání probíhá v jednom kroku na jednom místě v kódu. Principy využívající jQuery (příklady)
  • Oddělení javascript a HTML - knihovna poskytuje jednoduchou syntaxi pro přidání rutiny událostí DOM pomocí Javascriptu, namísto přidávání HTML atributů události volání funkce JS. Proto vyzývá vývojáře k úplnému oddělení kódu javascript od značky HTML.
  • stručnost a přehlednost - podporuje stručnost a přehlednost nástrojů, jako jsou řetězy a snížení názvy funkcí.
  • Eliminace cross-browser nekompatibilitu - JavaScriptu motory různé prohlížeče jsou mírně odlišné, takže JS kód, který pracuje na jednom prohlížeči, nemusí fungovat pro jiný. Stejně jako javascriptové nástroje, jQuery je všechny ovládánesrovnalostí mezi prohlížeči a poskytuje konzistentní rozhraní, které funguje v různých prohlížečích.
  • Rozšiřitelnost - nové události, prvky a metody lze snadno přidávat a znovu použít jako plugin.
  • Historie

    jQuery byl původně propuštěn v lednu 2006 na BarCamp NYC Johnem Reshigem a byl ovlivněn časnou knihovnou CSSQuery Deana Edwardse. V současné době je podporován vývojářským týmem Timmy Willison (s volbou jQuery selector engine, Sizzle, vedený Richardem Gibsonem).

    Funkce

    Knihovna obsahuje následující funkce:
  • volba prvků DOM pomocí multi-serverového mechanismu voliče s volným zdrojem Sizzle;
  • Výběr projektu manipulace DOM selektoru CSS, který používá jména a atributy prvků jako id, třídu jako kritéria pro výběr uzlů DOM;
  • opatření;
  • animační efekty;
  • ajax;
  • objekty jsou zpožděny a slibují, že řídí asynchronní zpracování;
  • analýza JSON;
  • Rozšiřitelnost pomocí pluginů;
  • nástroje, jako je detekce funkcí;
  • metody kompatibility, které jsou původně k dispozici v moderních prohlížečích, ale vyžadují starší verze, jako je inArray () a každý (), multi-browser (nedá se zaměňovat s křížovým prohlížečem).
  • Použití

    Knihovna jQuery je jediný soubor javascript, který obsahuje všechny své společné funkce DOM, události, efekty a Ajax. Může být zahrnut do webové stránky propojením s místní kopií nebo jedním z mnoha kopií dostupných veřejnostiservery Knihovna má síť pro doručování obsahu (CDN), kterou hostí max-cdn. JQuery PHP Příklad:

    styly

    jQuery má dva styly použití: $ funkce
  • A, který je předmětem výroby způsob jQuery. Tyto funkce, často nazývané příkazy, jsou celočíselné, protože všechny objekty jQuery vracejí.
  • ​​
  • Přes funkce $ - prefix. Jedná se o servisní funkce, které přímo neovlivňují objekt.
  • Přístup k JQuery a správa více uzlů DOM obvykle začíná voláním funkce $ pomocí řádku voliče CSS. Tím se vrátí objekt jQuery, který odkazuje na všechny relevantní prvky na stránce HTML.

    Režim bez konfliktu

    jQuery zahrnuje režim .noConflict (), který uvolňuje kontrolu nad funkcí $. To je užitečné, pokud se jQuery používá s jinými knihovnami, které také používají $ jako identifikátor. V režimu bez konfliktu mohou vývojáři použít knihovny jako náhradu za 2 dolary bez ztráty funkčnosti.
    Pokročilé funkčnosti
    Funkce zpětného volání pro manipulaci s událostmi na položkách, které ještě nejsou načteny, mohou být přihlášeny jako. Anonymní funkce. Tyto manipulátory budou volány pouze při spuštění události. Například následující kód přidává handler pro klepnutí myší na obrázek prvek img:. $ (Function () {$ ('img') On ('cvaknutí', function () {//proces akce klikněte na libovolný prvek na stránce img });}). Některé funkce vracejí určité hodnoty (například $ ('# input-user-email'). V těchto případech řetězec nefunguje, protože hodnota neodkazuje na objekt jQuery.

    Vytváření novýchprvky

    Kromě přístupu k DOM uzly přes hierarchii objektů, to je také možné vytvářet nové položky v případě, že řetězec předán jako parametr $ () vypadá jako HTML. Například výběr řádková položka je HTML s identifikačními kartami a přidává prvek s hodnotou opcí a textové VAG Volkswagen: $ ('# zvolte carmakes') .append ($ ('') .attr ({value: VAG} .append) (Volkswagen ))

    Nástroje

    Funkce jQuery s prefixem $ jsou utilitní funkce, které ovlivňují globální vlastnosti a chování. V následujícím příkladu je funkce každé (), který provádí iteraci přes pole: .each $ ([1,2,3], funkce () {console.log (to + 1);}); Tento příklad jQuery zapíše do konzole 234.

    Ajax

    lze provádět napříč prohlížeči žádostí Ajax pomocí $ .ajax () jQuery, který může sloužit jako příklad souvisejících metod pro nahrávání a zpracování dat odstraněn: $ .ajax ({typ: POST, url: ' /process/submit.php 'údaje {název: umístění John:' Boston '}}) hotovo (funkce (MSG) {alert. (' data uložená: ‚+ MSG).}) selhání (function (XMLHttpRequest, statusText, errorThrown) {alert ('nepodařilo odeslat povidomlennya.Nn' + 'XML požadavku HTTP:' + JSON.stringify (XMLHttpRequest) + 'nStatus text:' + statusText +‘, nChyba Thrown: '+ chybaThrown};}); V tomto příkladu má server název dat = John a umístění = Boston pro /process/submit.php. Po dokončení této žádosti je funkce volána, aby upozornila uživatele. Pokud žádost selže, upozorní uživatele na chybový stav žádosti a konkrétní chybu.

    Pluginy

    Architektura jQuery umožňuje vývojářům vytvářet vlastní kód pro rozšíření různých funkcí. Na internetu jsou k dispozici tisíce dalších modulů, které pokrývají celou řadu funkcí, napříkladAjax pomocníci, webové služby, dynamické seznamy, XML a XSLT nástroje, drag and drop, události, zpracování souborů cookie a modální okna. Existují alternativní plug-iny pro vyhledávačů, jako je jquer.in pomocí více specializovaných přístupů, jako je přenos pouze plug-iny, které splňují určitá kritéria (například ti, kteří mají společné úložiště kódu). Vývojář poskytuje vzdělávací centrum s jQuery pro začátečníky, které mohou uživatelům pomoci pochopit javascript a začít rozvíjet pluginy.

    jQuery UI

    jQuery UI widget je sada rozhraní, animované vizuální efekty a ty implementován pomocí jQuery CSS (javascript knihovnu), kaskádové styly a HTML. Podle zpravodajských služeb JavaScriptu, Libscore, jQuery UI používá na více než 197,000 špičkové webové stránky, což je druhý nejpopulárnější knihovny JS. Nejslavnější jsou Pinterest, PayPal, IMDb, Huffington Post a Netflix.
    UI jQuery je bezplatná a otevřená zdrojová nadace, licencovaná společností MIT. To bylo poprvé publikováno v září 2007.

    jQuery Mobile

    jQuery Mobile - webová infrastruktura s dotykovým optimalizace (také známý jako mobilní infrastruktury). Těžiště vývoje na vytvoření infrastruktury, která je kompatibilní s celou řadou chytrých telefonů a tabletových počítačů potřebných pro rostoucí trh digitální techniky. Kompatibilní s dalšími platformami mobilních aplikací, jako je PhoneGap, Worklight a mnoho dalších.

    Související publikace