jQuery: řešení a prevence problémů
Článek přináší pár tipů jak se vyhnout problémům při práci s jQuery a stručný přehled několika klíčových změn v jádru jQuery.
Ikdyž by jQuery mělo eliminovat rozdíly v implementaci JS, DOMu v různých prohlížečích, občas jsem se setkal rozdílným chováním v IE a FF. Některé z těchto problémů byly přiznané jQuery bugy. Vyplatí se proto jQuery upgradovat. Je tak ale třeba činit po zralé úvaze, protože s novými verzemi nejsou odstraňovány jen bugy, ale občas i vcelku radikálně změněho chování.
Pár zlomových bodů ve vývoji jQuery
Za klíčové momenty považuji doposud (tj. do v. 1.2.3):
Verze 1.2: Zrušena podpora XPath selektorů aj.
Ve verzi 1.2 byly odstraněny některé metody a některé označeny za „deprecated“. Především však byla zrušena podpora XPath selektorů. Chcete-li mít podporu XPath selektorů ve jQuery 1.2 a vyšším, je třeba použít XPath plugin. Pokud potřebujete zajistit plnou zpětnou kompatibilitu s jQuery před 1.2, použijte jQuery 1.1 Compatibility Plugin.
Verze 1.2.2: Zrychlení, přepracování .ready()
Ve verzi 1.2.2 došlo k rapidnímu zrychlení vyhledávání elementů v DOMu a bylo změněno chování $(document).ready – hlavní změna tkví v tom, že se nyní čeká také na načtení CSS. Změna je motivována snahou mít k dispozici informace (vlastnosti) elementu nastavené pomocí CSS.
Používání jiných JS frameworků spolu s jQuery
Pokud potřebujete použít na jedné stránce jQuery a zároveň třeba Prototype JS, který také používá „dollarovou“ funkci $(…), můžete použít jQuery.noConflict(). Viz též Using jQuery with Other Libraries a Custom Alias in page code.
Řešení problémů, resp. work-arounds
Následující tipy jsou typu „tonoucí se stébla chytá“ – tj. rozhodně nejsou ideálním řešením.
- Když (zvláště v IE) nefunguje něco zapsaného v $(document).ready() zkusit použít $(window).load() (ev. napsat mimo $(document).ready(), pokud to nezbytně nepotřebujete).
Pozor – každý postup dělá, ale něco jiného: - $(document).ready()– čeká na načtení DOMu (od verze jQuery 1.2.2 i na načtení CSS)
- $(window).load() – čeká na úplné načtení stránky včetně grafiky
- Když nefunguje $("#mujselektor").hide() zkusit použít $("#mujselektor").css("display","none") (to samozřejmě skryje element jen při zapnutých CSS).