Vytvoření interaktivního webu: Úvod do jQuery

reklama

jQuery je skriptovací knihovna na straně klienta, kterou téměř každý moderní web používá - díky tomu jsou webové stránky interaktivní. Není to jediná knihovna Javascript, ale je to nejrozvinutější, nejvíce podporovaná a nejrozšířenější. Je to jeden ze stavebních kamenů každého moderního webu. Co přesně je jQuery, co je tak populární a proč byste se o to měli zajímat, pokud začínáte jako webový vývojář?

Co je jQuery?

jQuery je rozšíření Javascriptu, knihovny Javascript funkce a nástroje, které dodávají vizuální nádech a usnadňují implementaci pokročilých funkcí v několika řádcích kódu. Je podporován napříč prohlížeči a otevřeným zdrojovým kódem. Navíc můžete rozšířit funkčnost jQuery pomocí snadno použitelných pluginů.

jQuery je postaven na Javascriptu, ale přidává metody a funkce, které v čistém Javascriptu nenajdete. Byl vytvořen za účelem zjednodušení používání Javascriptu a odstranění potíží souvisejících s různou implementací Javascriptu v různých prohlížečích. S jQuery můžete psát jen jednou a jQuery bude interpretovat váš kód správně pro jakýkoli prohlížeč.

Hlavní funkcí jQuery je manipulace s DOM (DOM je Object Object Model), což znamená základní strukturu jakékoli navštívené webové stránky. Každá jediná věc, kterou vidíte na stránce - a mnoho, které nevidíte - jsou zastoupeny v DOM.

jQuery není jedinou knihovnou Javascript, ale je nejoblíbenější - používá ji asi 55% z 10 000 nejnavštěvovanějších webů. Prototyp, MooTools a Skriptové jsou populární alternativy, ale nejsou zdaleka tak dobře podporovány.

Strana klienta vs. strana serveru

Většina webových stránek je generována na straně serveru - MakeUseOf používá PHP a MySQL (ve formě WordPress) k načtení dat artiklů z databáze a poté na ně aplikuje šablonu. Výsledná stránka se odešle do vašeho prohlížeče, interpretuje a zobrazí se vám. Kliknutím na odkaz vytvoříte do databáze další požadavek a vygeneruje se další stránka. Ale co když chcete na stránce vytvořit nějaký druh interaktivity? Formulář, který kontroluje, co typ uživatele (jako je Twitter, který počítá, kolik písmen vám zbývá), a tlačítko, které vyvolá dialogové okno, nebo možná budete chtít načíst další data, aniž byste museli načíst celý stránka?

To je kde skriptování na straně klienta přichází do hry. To je místo, kde klient - váš prohlížeč - provádí těžké zvedání. Většina webových stránek, včetně tohoto, používá trochu z obou.

Proč používat jQuery?

Vizuální flair

jQuery vám umožní změnit části webové stránky v reakci na akce uživatele. Jako rychlý příklad, klikněte na tento odkaz - každý odkaz na stránce bude změnit na červenou. Zbytečný? Možná, ale pochopíte. Prezentace obrázků jsou běžným využitím jQuery. Vyvážení zbytečných vizuálních efektů a skutečně užitečných doplňků uživatelské zkušenosti je součástí dovednosti v tom, že jste webový vývojář.

Tady je rychlý seznam některých opravdu úžasných efektů, kterých můžete dosáhnout.

Snadné události

Téměř veškerý software pracuje na modelu události - klikněte na něco a spustí se událost click. Přetáhněte prst po tabletu a spustí se událost přetažení. Aplikace tyto události „poslouchají“ a dělají něco - jQuery vám to umožňuje v prohlížeči.

Proveďte jednoduše AJAX

Asynchronní Javascript a XML je způsob komunikace se vzdáleným serverem bez nutnosti načítání další stránky. Dobrým příkladem je streamování stavu na Facebooku. Zkuste procházet všechny své aktualizace, dokud se nedostanete na dno. Nemůžeš. Jakmile se dostanete na konec, jQuery zjistí, že jste blízko, a odešle požadavek AJAX na zobrazení dalších stavů.

Poté je vloží na aktuální stránku, aniž byste si to uvědomovali. Získáte nekonečný proud aktualizací, ale na začátku nejsou všechny načteny.

Pokročilá uživatelská rozhraní

Spolu s uživatelské rozhraní jQuery jádro plugin, můžete vytvořit kompletní webové aplikace pomocí standardních součástí formuláře; ukazatele průběhu, posuvníky, tlačítka, karty, přetahování - vše je tam. Jednoduchý tematický systém umožňuje přizpůsobit vzhled a dojem, nebo můžete použít jedno z výchozích nastavení.

Měl bych se starat?

Pokud máte vůbec zájem o vývoj webových stránek Jaký programovací jazyk se učit - webové programováníDnes se podíváme na různé webové programovací jazyky, které pohánějí internet. Toto je čtvrtá část programovací série pro začátečníky. V části 1 jsme se naučili základní ... Přečtěte si více , pak ano - jQuery je věc, kterou se určitě musíte naučit. Pokud jste se někdy zeptali sami sebe "Jak mohu donutit X udělat Y, když uživatel provede Z?", pak si zamilujete jQuery. Přidání na váš web je stejně jednoduché jako přidání odkazu na něj v záhlaví; nebo řekněte WordPress, aby jej načíst.

Chtěli byste se naučit jQuery? Dejte nám vědět v komentářích a uvidím, co mohu udělat.

Obrazové kredity: Dynamicky rotující billboard vytvořený pomocí jQuery, PistolSlut.com, Graf vytvořený pomocí jQuery