javascript - jquery给出TypeError从包装集中获取元素

Question

我是一名菜鸟，正在练习获取具有 alt 属性的所有 img 元素集合中的第一个元素。在第 35 页的 jQuery in Action 第一版中，我在“Wrapped Set Lab”中输入以下命令:

$("img[alt]").get(0)

或者这个:

$("img[alt]")[0]

这两个命令都在控制台中给出了这个异常:

错误:TypeError Object# 没有方法 'addClass'

这是标记片段:

<div>
  <img src="images/image.1.jpg" id="hibiscus" alt="Hibiscus"/>
  <img src="images/image.2.jpg" id="littleBear" title="A dog named Little Bear"/>
  <img src="images/image.3.jpg" id="verbena" alt="Verbena"/>
  <img src="images/image.4.jpg" id="cozmo" title="A puppy named Cozmo"/>
  <img src="images/image.5.jpg" id="tigerLily" alt="Tiger Lily"/>
  <img src="images/image.6.jpg" id="coffeePot"/>
</div>

Yet another post in SO建议这是正常的，并写信改为使用以下内容:

$("img[ALT]").eq(0)

有效并返回包装集中的 1 个元素: IMG#木槿

这本书的勘误表部分没有任何内容。 SO帖子的回复者解释说 “当您访问带有 [i] 等下标的集合中的元素时，您实际上是从 jQuery 对象中解包它，并访问原始 DOM 节点，它没有 addClass 和 css 等方法。”

我是 jQuery 的新手，不理解这个错误，也不理解相关 SO 帖子中的解释。

Answer 1

addClass 是一种 jQuery 方法。它只能在 jQuery 对象上调用。当您在 jQuery 对象上调用 [0] 或 .get(0) 时，您正在获取底层 DOM 元素。该对象不支持 jQuery 方法。

您应该在 jQuery 对象本身上调用 addClass:

img[alt].addClass('my-new-class');.

如果您只想将一个类添加到具有 alt 属性的第一张图片，您可以将 jQuery 选择器更改为 $('img[alt]:first').