Hemanth's Scribes

web

Native JS Like jQuery

Author Photo

Hemanth HM

Thumbnail

Native JS Like jQuery

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); }

NativejQuery
$$(‘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.

#javascript#linux
Author Photo

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.