使用jQuery选择前n个项目

Question

使用jQuery，我需要选择页面上的前n个元素，比如只选择前20个链接，而不是像通常一样选择所有的链接。

$("a")

听起来很简单，但是 jQuery 手册中没有类似这样的证据。

- Omiod

Answer 1

你可能想要了解slice。你的代码将看起来像这样：

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

- istruble

---

如果你有一个大的结果集，使用切片的方法比 ":lt(20)" 更高效。尽管 ":lt" 和其他位置选择器看起来更加简洁，但不幸的是，当它们被评估时，jQuery会循环遍历整个集合，即使只获取第一个元素。我在这里写了更多关于这个问题的博客：http://spadgos.com/?p=51 - nickf

谢谢，我的要求还涉及性能方面，所以这对我来说是正确的答案。感谢其他人指出了 :lt 选择器。 - Omiod

@nickf提供了有用的评论，但是博客链接和图形链接似乎无法使用。 - Fractalf

抱歉，现在无法编辑 -- 基本上，使用切片会更快。 - nickf

Answer 2

使用lt伪选择器：

$("a:lt(n)")

这将匹配第n个元素之前（不包括第n个元素）的所有元素。计数从0开始。

- kgiannakakis

---

根据jQuery文档，现代浏览器中使用.slice方法速度更快。 - Blaise

我喜欢使用jQuery风格，它比链式更优雅。 - Fedir RYKHTIK

Answer 3

我在lt()文档的结尾发现了这个注释：

额外注释：
因为 :lt() 是 jQuery 的扩展，而不是 CSS 规范的一部分，使用 :lt() 的查询不能利用本机 DOM querySelectorAll() 方法提供的性能提升。为了在现代浏览器中获得更好的性能，请改用 $("your-pure-css-selector").slice(0, index)。

因此使用$("selector").slice(from, to)可以获得更好的性能。

- Arlind Nushi

Answer 4

尝试使用 :lt 选择器: http://docs.jquery.com/Selectors/lt#index

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

- David Hellsing

Answer 5

.slice（）并不总是更好。在我的情况下，使用jQuery 1.7和Chrome 36，.slice（0，20）会出现错误：

RangeError：超出最大调用堆栈大小

我发现在这种情况下 :lt(20) 可以正常工作而没有错误。我可能有成千上万个匹配元素。

- Kevin Gwynn

Answer 6

$("a:lt(n)")

JQuery 文档

- hsz