javascript - 如何使用 jquery 选择器获取第三或第四个元素并设置其 id

Question

我想获取第三个或第四个元素并设置它的 id。

我找到：

$('#menu li:first').attr('id', 'test')

它实际上有效，但我只得到第一个元素。另一方面，我尝试使用以下内容，但它不起作用。

$('#menu li').get(0).attr('id', 'test')

有人可以解释如何获得理想的元素吗？（例如 4 或 5）并设置其 id 以及为什么第二组代码不起作用？

Answer 1

您可以使用eq()方法：

$('#menu li').eq(2).attr('id', 'third') // selects third element
$('#menu li').eq(3).attr('id', 'fourth') // selects fourth element

Answer 2

尝试使用.eq功能。

$('#menu li').eq(4).attr(...)

或者

$('#menu li:eq(4)').attr(...)

在旁注.get(0)中返回一个 DOM 元素而不是 jQuery 对象。

Answer 3

$('#menu li:eq(3)').attr('id', 'id_4');
$('#menu li:eq(4)').attr('id', 'id_5');

或者

$('#menu li').eq(3).attr('id', 'id_4');
$('#menu li').eq(4).attr('id', 'id_5');

eq()或者:eq()两者都采用目标元素的参数索引，并且它总是

targetElementIndex - 1. 因为它是基于零的。

因此，如果您以第 4 个或第 5 个元素为目标，那么您必须将参数作为 3 和 4。

演示

Answer 4

如评论中所述， get() 返回 DOM 元素。

可以在不使用 jquery 的情况下设置元素的 id attr()。

$('#menu li').get(3).id = 'test';

Answer 5

$('#menu')

选择 id 为“menu”的元素。

$('#menu li')

或者

$('#menu').find('li')

选择它的所有<li>后代和

$('#menu li').eq(3)

选择第四个（因为它们从零开始标记）。

另请注意

$('#menu li')[3]

将获得 HTMLElement 本身，而不是其 jQuery 包装器。