javascript - 如何在 jQuery 中处理单个类的多个实例？

Question

我不确定如何处理这样的多个实例。我知道在普通的 JS 中我可以简单地使用 [0] 等。

我的代码是这样的：

location.href = $('a.test').attr('href');

我需要处理测试的第一个实例和第二个实例。有没有简单的

location.href = $('a.test')[0].attr('href');

我失踪了还是这样？

Answer 1

$('a.test')[0]返回一个没有该方法的 dom 元素引用attr()，因此您的脚本将失败

使用 .eq(index)

location.href = $('a.test').eq(0).attr('href');

或者

location.href = $('a.test:eq(0)').attr('href');

Answer 2

您正在尝试在 javascript DOM 对象上调用 attr 而不是使用 jQuery 对象作为索引器返回 DOM 对象使用eq()获取 jQuery 对象

location.href = $('a.test').eq(0).attr('href');

您可以使用带 href 而不是 attr 的 DOM 对象

location.href = $('a.test')[0].href;

Answer 3

location.href = $('a.test').eq(0).attr('href');

或者你可以试试

location.href = $('a.test:eq(0)').attr('href');

参考eq()和:eq()和attr

Answer 4

这个演示可能会有所帮助：工作演示 http://jsfiddle.net/CmQGu/

你也可以在这里使用nth-childapi 演示：http: //jsfiddle.net/wYdyJ/

有很多方法可以解决这个问题，就像我在演示中向你展示的那样。如果您热衷于阅读此内容：.eq() 和 .get() 和 :nth-child() 之间的区别？

接口：

• first: http://api.jquery.com/first/（所有窥视者都错过了这个）
• eq：http ://api.jquery.com/eq/
• nth-child：http ://api.jquery.com/nth-child-selector/

代码：

alert(location.href = $('a.test').eq(0).attr('href'));

alert(location.href = $('a.test').first().attr('href'));

alert(location.href = $('a.test:nth-child(2)').attr('href'));

希望能帮助到你:)