jQuery návod – (2) Jak začít
Vítejte zpět ve druhém díle našeho seriálu o jQuery! V minulém článku jsme si řekli něco o tom, co je to vlastně jQuery a proč je tak oblíbené. Dnes se ponoříme do praktické části a ukážeme si, jak začít s jQuery v našem projektu.
1. Stažení a integrace jQuery
Prvním krokem je samozřejmě mít jQuery v našem projektu. Existuje několik způsobů, jak toho dosáhnout:
1. Stáhnout z oficiálního webu
- Navštivte jQuery.com a stáhněte si nejnovější verzi.
- Vložte stažený soubor do složky s vaším projektem a pak ho linkujte v HTML souboru pomocí „<script>“ tagu.
<script src="cesta/k/jquery.js"></script>
3. Použít CDN (Content Delivery Network)
- Pokud nechcete stahovat jQuery přímo do vašeho projektu, můžete ho načítat přes CDN.
- Jedním z populárních CDN je například Google:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
2. Kontrola, zda jQuery funguje
Po integraci jQuery byste měli ověřit, zda vše funguje správně. To můžete udělat následujícím kódem:
$(document).ready(function(){ alert("jQuery je nyní připraveno!"); });
Pokud se vám zobrazí alert s touto zprávou, vše funguje, jak má.
3. Základy syntaxe
Jedním z hlavních důvodů popularity jQuery je jeho snadná a intuitivní syntaxe. Základem je výběr (neboli selekce) elementů a provedení nějaké akce na nich.
Základní syntaxe vypadá následovně:
$(selektor).akce();
- $ – Znamená, že chceme pracovat s jQuery.
- selektor – Vybere HTML element(y).
- akce() – Je JavaScriptová funkce, kterou chcete provést na vybraném elementu.
4. Ukázka základního kódu
Pojďme se podívat na jednoduchý příklad:
$(document).ready(function(){ $("p").click(function(){ $(this).hide(); }); });
Co tento kód dělá? Když uživatel klikne na jakýkoli odstavec („<p>„), daný odstavec zmizí.
Závěr
Nyní víte, jak začít s jQuery ve vašem projektu. Integrace je snadná, a díky CDN se můžete dokonce vyhnout stažení knihovny do vašeho projektu. Se syntaxí jQuery se budeme setkávat pravidelně v dalších částech tohoto seriálu, takže je dobré si ji co nejdříve osvojit.
V dalším díle seriálu se zaměříme na psaní našeho prvního kódu a podíváme se blíže na základní funkce a selektory v jQuery. Takže neváhejte a připojte se k nám i příště!
Děkuji za čtení a těším se na setkání v dalším díle!