Hamster
Hamster

Reputation: 3132

jQuery Selectors: Which is faster for grabbing a subset of children?

Following up on this question, I have the following 2 options:

$("tr td").slice(3, 6);

And possibly something like this (algorithmically speaking, I mean; I know making new query strings for each element is kinda silly):

var subset = $( "tr td:nth-child(4)" );
for(var i=4; i<7; i++) subset.add( "tr td:nth-child("+i+")" );

Which would perform more efficiently? Would there be another more efficient solution?

Upvotes: 4

Views: 307

Answers (2)

kennytm
kennytm

Reputation: 523254

In the 1st code, you compute $('tr td') once and get a slice.

In the 2nd code, you compute $('tr td') 4 times, then extract the 4th to 7th child at each time.

Therefore the 1st code is faster. In fact, it is easier to read as well.

Upvotes: 0

Nick Craver
Nick Craver

Reputation: 630389

The first ($("tr td").slice(3, 6)) would perform much faster, as it's a single selector engine call, but as always, test it!

I set up a performance test so you can check both (and other answers) yourself here: http://jsperf.com/slice-performance-test

Upvotes: 3

Related Questions