15 komentářů k článku JavaScript Restart – QuerySelector:

1. 

   DavidGrudl 11.2.2015 v 12:35

   Funkce jQuery nevrací pole
   V článku je jedna nepřesnost: funkce jQuery (nebo častěji $) nevrací pole, nýbrž objekt jQuery.

   Dojem, že $ vrací pole, může podpořil Chrome Developer Tools, který (nepochopitelně) v konzoli objekty jQuery vypisuje úplně stejně, jako by šlo o pole. Proto třeba na školeních jQuery jsem vždycky trval raději na používání Firebugu, který to vypisuje správně.

   Objekt jQuery ukládá podobně jako pole prvky pod číselné klíče a má proměnnou length, tudíž se s ním dá trošku jako s polem pracovat (říká se tomu array-like object), ale další metody, jako například v článku zmíněnou forEach, nemá ani jQuery. Pro převod jQuery na pole slouží metoda toArray().

   Ale jinak fajn článek. jQuery splnilo svou důležitou historickou úlohu a většinu jeho někdejších úloh dnes zvládá nativní DOM. jQuery je dnes knihovna pro AJAXové requesty a promise pattern ;-)

   Odpovědět
1. 

   Miroslav JuhosAutor příspěvku 11.2.2015 ve 19:00

   Re: Funkce jQuery nevrací pole
   Ajéje, to jsem si nikdy neuvědomil a Chrome Console mne nachytala. Inu člověk se učí pořád.

   Pod větu

   jQuery splnilo svou důležitou historickou úlohu a většinu jeho někdejších úloh dnes zvládá nativní DOM.

   bych se i podepsal.

   O XHR a promisích třeba někdy příště.

   Odpovědět
2. 

   Daniel 23.2.2015 v 10:37

   Re: Funkce jQuery nevrací pole
   Dev tools to loguje ako array preto, lebo ma v prototype ulozenu array.prototype.splice.

   https://gist.github.com/danielhusar/6030dcf3e615e7f482f1

   Odpovědět
3. 

   Jakub Vrána 28.2.2015 ve 05:30

   Další nepřesnosti
   Pár dalších nepřesností:

   1. element.className.replace('active', '').trim(); odstraní nejen třídu active, ale i active ze všeho, co to obsahuje jako podřetězec. Obvykle se používalo něco jako .replace(/(^| )active( |$)/g, ' ').
   2. document.all není funkce, ale vlastnost.
   3. Pole se nevyznačují tím, že by měly metodu item, ale tím, že mají vlastnost length.

   Odpovědět
4. 

   steida 16.3.2015 ve 18:34

   Re: Funkce jQuery nevrací pole
   Ani pro ten promise pattern není, protože jQuery ho zkurvila a nikdy neopraví. tl;dr Nepracuje vůbec s chybama.

   Odpovědět
2. 

   dherbolt 12.2.2015 v 07:14

   Rozdíl mezi objektem jQuery, NodeList (statický) a HTMLCollection
   Funkce document.getElementsBy* nevrací pole, ale HTMLCollection. Tato kolekce má sice propertu length a k prvkům je možné přistupovat přes index (podpbně jako v případě objektu jQuery), ale oproti nim je HTMLCollection „živá“. Kolekce je automaticky aktualizována pokud dojde ke změně v dokumentu.

   var els; 
   
   document.body.appendChild(document.createElement('div'));
   els = document.getElementsByTagName('div');
   els.length; // 1
   
   document.body.appendChild(document.createElement('div'));
   els.length; // 2
   

   Funkce document.querySelectorAll vrací statický NodeList. V tomto případě nedochází k automatické aktualizaci. Zde je nutné upozornit také na existenci „živého“ NodeList. V tomto typu jsou uloženy například childNodes.

   Odpovědět
3. 

   smokie.mt 12.2.2015 v 12:13

   Neviem, neviem
   Chapem motivaciu zanechat jQuery a vratit sa k nativnym funkciam Javascriptu, ale prave jedna z vlastnosti, pre ktore je jQuery tak oblubene je moznost venovat sa inym veciam, nez mysliet na to, ci ta a ta implementacia bude podporovana v tom a tom prehliadaci.

   A ked som si pocas citania clanku uvedomil, ze asi polovica textu je venovana tomu ako treba to a to volanie upravit aby bolo podporovane v tom a tom prehliadaci, tak som si povedal, ze toto nebude pre mna.

   Odpovědět
1. 

   DavidGrudl 12.2.2015 ve 16:54

   Re: Neviem, neviem
   Všechno v článku funguje od IE 10, tady na cca 90-95 % prohlížečů. Tedy pro tyto nejčastější úkoly už pomalu přestává být jQuery potřeba. Na některých webech už dnes, na jiných brzy.

   Odpovědět
1. 

   Jakub 13.2.2015 ve 15:45

   Re: Neviem, neviem
   No právě, IE10 je už hodně velký luxus. Běžně se setkávám spíše s požadavky na IE9, občas i IE8. Často i na WinXP. Situace ve velkých korporátech je smutná. A může jít klidně i o veřejný web, ale když si ho ředitěl se svou IE8 neprohlídne, tak je úplně jedno, že 95% zbytku světa ano :)
   I když není vše tak špatné, třeba jeden zákazník teď od nového roku IE8 upustil a začal používat rovnou IE11.

   Odpovědět
1. 

   Lemming 14.2.2015 v 10:17

   Re: Neviem, neviem
   Souhlas. Děláme veřejný web, ředitel IE 8 nemá, ale zato business má statistiku prohlížečů uživatelů. Teprve asi před rokem jsem prosadil, že kulaté rohy se už konečně mohou dělat přes border-radius a ne obrázky, ale pořád platí, že uživatel s IE 8 musí mít plnohodnotný přístup k aplikaci, byť s povolenými grafickými odlišnostmi, jako třeba ty nekulaté rohy.

   Na podzim jsme dělali jedno zobrazení, na které by bylo super inline SVG. Bohužel, to by nefungovalo v IE 8, takže to neprošlo a musím to kreslit Javascriptem v Raphael… :(

   Tak holt vypadá komerční realita mimo technologická dema a startupy :) Když mám na webu pár návštěvníků, tak se s IE 9 / IE 8 patlat nevyplatí, ale pro navštěvovanější weby dávají v absolutních číslech pořád dost lidí, aby se vyplatilo kvůli tomu vývojáře prudit.

   Odpovědět
2. 

   Martin 13.2.2015 ve 21:58

   Re: Neviem, neviem
   Ve finale stejne clovek potrebuje nejaky obal na tu nativni API, protoze ta API je skvela v tom, ze dava nekonecne moznosti pouziti, ale chtel bych si implementovat chainovani, atd… Kazdopadne v IE10+ je to otazka cca jednoho dne napsat si knihovnicku na selector a manipulaci s nody. Stejne tak ajaxy nejsou zadna veda s XHR a FormData.

   Jen bych jeste dodal k clanku, ze jak insertAdjacentHTML tak innerHTML je akorat tak cesta pro XSS a navic budu mit nekde v stringu seredny HTML. Takze pokud to delam u klienta, tak si to muzu krasne sestavit z document.createElement, document.createTextNode a pokud si posilam HTML, ze serveru tak bych si mel byt sakra jisty co tam mam, nez to takhle vlozim do stranky.

   Odpovědět
4. 

   helb 13.2.2015 v 10:25

   You might not need jQuery…
   Docela šikovný web pro rychlé oživení „čistého“ javascriptu po letech používání jQuery – http://youmightnotneedjquery.com/

   Odpovědět
1. 

   xxar3s 14.2.2015 v 12:50

   Re: You might not need jQuery…
   Ten clanok prave krasne ukazuje ze JQuery ma zmysel. Kazdy zapis v JQuery je kratsi ako v nativnom HTML a tym padom aj prehladnejsi… Od toho su kniznice, aby sme zbytocne nepisali kod, ktory uz napisal niekto iny, ale venovali sa podstate problemu, ktory riesime.

   Odpovědět
5. 

   xerno 17.2.2015 v 01:30

   Sizzle
   Faktická: není to náhodou tak, že knihovna Sizzle (se kterou pracuje jQuery) používá querySelectorAll pokud je dostupné? řádek na Gitu jako důkaz…

   Tím se ale nesnažim tvrdit, že by práce s nativním JS nebyla rychlejší. I kdyby byly ve výsledku použity stejné metody, knihovny budou mít vždy režii navíc. Na druhou stranu knihovny se těší podobnějšímu chování napříč prohlížečovým spektrem, člověk se pak nemusí starat o vyjímky a fallbacky.

   Pokud jde ale v prvé řadě o výkon, není těžké si jednoduchý fallback napsat:
   if(!document.querySelectorAll) document.querySelectorAll = Sizzle;

   Odpovědět
6. 

   Dash 23.2.2015 ve 16:53

   jQuery 2
   Vzhledem k tomu, že jQuery 2 většinu z těchto novinek používá, tak nevidím důvod jej nepoužít. Minimálně kvůli větší přehlednosti a úspornosti kódu.

   Odpovědět