Hacker News Reader

Comment by MatthewPhillips | Hacker News Reader

I'm just curious what the higher-level APIs are that people need from jQuery that aren't available on mobile. I recall jQuery being popular for selector queries (available on all mobile browsers natively with querySelector and querySelectorAll) and for even listeners (offers no real advantage over addEventListener as far as I can tell).

View on HN

Well one nice affordance jQuery offers, is you can do manipulations en-mass without having to write out a loop, or use Array.forEach(). This helps simplify event binding and manipulation code. Also there are selectors in jQuery that are not available in querySelectorAll. And lastly querySelectorAll has some pretty buggy implementations. jQuery smoothes these out.

Binding event handlers in a loop is an anti-pattern greatly promoted by jQuery during several years. You should use event delegation.

Sure but $('.clicky').on('click', doSomething); means no loops at all, and will bind events to all matching elements. I don't think there is a native API way to do this.

Edit: typos

document.getElementsByClassName('clicky').forEach(function(el) { el.addEventListener('click', doSomething); });

I'm not sure that works. getElementsByClassName (and Id and querySelector) returns a NodeList, not an Array, so there's no foreach, you have to convert it to an array first.

Array.prototype.slice.call(document.getElementsBy....

That's also a ton of tying and a lot of code that a minifier can't reduce. I guess its possible, but do you really want to writing such verbose code?

As far as I know jQuery is written with "native API", so there is obviously a way to do this in JavaScript.

    document.body.addEventListener("click", function(e) { 
      if (e.target.className == "clicky") {
        doSomething();
      }
    }, false);

Reply on news.ycombinator.com