Selecting the first “n” items with jQuery

Question

With Jquery, I need to select just the first "n" items from the page, for example the first 20 links instead of selecting all of them with the usual

$("a")

Sounds simple but the jQuery manual has no evidence of something like this.

Answer 1

I found this note in the end of the lt() docs:

Additional Notes:
Because :lt() is a jQuery extension and not part of the CSS specification, queries using :lt() cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use $("your-pure-css-selector").slice(0, index) instead.

So use $("selector").slice(from, to) for better performances.

Answer 2

.slice() isn't always better. In my case, with jQuery 1.7 in Chrome 36, .slice(0, 20) failed with error:

RangeError: Maximum call stack size exceeded

I found that :lt(20) worked without error in this case. I had probably tens of thousands of matching elements.

Answer 3

Use lt pseudo selector:

$("a:lt(n)")

This matches the elements before the nth one (the nth element excluded). Numbering starts from 0.

Answer 4

$("a:lt(n)")

JQuery Documentation

Answer 5

Try the :lt selector: http://docs.jquery.com/Selectors/lt#index

$('a:lt(20)');

Answer 6

You probably want to read up on slice. Your code will look something like this:

$("a").slice(0,20)