Lately was pawing at some Selector API’s and really liked the raw power of native JS!
So here is some comaprsion of Native JS vs jQuery selectors
As jQuery uses ”$” as a shortcut for “jQuery”, lets defined a naughty $$ for making things much more easier. [ True! I can use “jQuery.noConflict()”.]
As per the standards The dollar sign ($) and the underscore (_) are permitted anywhere in an IdentifierName.
function $$(selector){ return Array.prototype.slice.call(document.querySelectorAll(selector), 0); }
| Native | jQuery |
|---|---|
| $$(‘body’).length | |
| $(‘body’).length |
$$(‘div’).length
| $(‘div’).length
$$(‘body div’).length
| $(‘body div’).length
$$(‘div > p’).length
| $(‘div > p’).length
$$(‘div + p’).length
| $(‘div + p’).length
$$(‘div ~ p’).length
| $(‘div ~ p’).length
$$(‘div[class^=exa][class$=mple]‘).length
| $(‘div[class^=exa][class$=mple]‘).length
$$(‘div, p, a’).length
| $(‘div, p, a’).length
The above is just the starting to it, even though /me has great respect towards jQuery I like to paw more on native js.
About Hemanth HM
Hemanth HM is a Sr. Machine Learning Manager at PayPal, Google Developer Expert, TC39 delegate, FOSS advocate, and community leader with a passion for programming, AI, and open-source contributions.