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

How to use jquery selectors to get the third or fourth element and set its id

本文关键字：元素 四个 设置 id jquery 选择器 何使用 三个 获取      更新时间：2023-09-26

我想获取第三个或第四个元素并设置其ID。

我发现：

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

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

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

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

您可以使用eq()方法：

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

尝试使用.eq函数。

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

或 

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

附带说明.get(0)返回一个 DOM 元素而不是 jQuery 对象。

$('#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。

演示

如注释中所述，get（） 返回 DOM 元素。

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

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

$('#menu')

选择ID 为"菜单"的元素。

$('#menu li')

或

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

选择所有<li>后代，然后

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

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

另请注意

$('#menu li')[3]

将获取 HTMLElement 本身，而不是它的 jQuery 包装器。

相关文章：