jQuery attr（）不会向<li> </li>添加id

Question

当我加载我的网页并在JS控制台中运行以下命令

时

$('#toRead li')[2]

我收到以下内容：

<li class="bookToRead"> ... </li>

这是我的期望。但是，当我在attr方法上添加如此添加id时：

$('#toRead li')[2].attr('id', 'firstBook');

抛出以下错误 - 未捕获TypeError：undefined不是函数

根据我的阅读，这是向元素添加id的方法。我一定错过了什么。

Answer 1

您收到错误是因为您正在引用DOM元素而不是jQuery对象。

如果使用eq api，它将返回一个jQuery对象：

$('#toRead li').eq(2).attr('id', 'firstBook');

在此处，您将从选择器中设置第3个返回id的{​​{1}}属性。

Answer 2

attr是一个jQuery对象方法 - 当您选择指定的[2]索引时，您将获得一个DOM元素，因此您可以使用setAttribute

$('#toRead li')[2].setAttribute('id', 'firstBook');

Answer 3

你可以这样做

var bookToRead = $('#toRead li')[2];
$(bookToRead ).attr('id', 'firstBook');