jQuery 对象更改为 HTML 元素，为什么？答案

【问题标题】：jQuery object is changed to HTML element, why?jQuery 对象更改为 HTML 元素，为什么？
【发布时间】：2016-08-31 20:29:46
【问题描述】：

我不明白 jQuery 的行为..

我有这个选择器和 $ 对象之后：

<span class="play-btn" data-play="true">
..
   <img />
..
</span>

var currentTrack = $('span.play-btn[data-play="true"] img');

结果：

问题：我需要访问 img 对象以获取 currentTrack[0].attr('src') 等属性，但是此代码 currentTrack[0] 创建 HTML 元素，只是字符串 (<img src="" data-id="" ..)，为什么？

【问题讨论】：

【解决方案1】：

jQuery 创建一个包含原生 DOM 节点的类数组对象，因此第一个原生 DOM 节点将位于 jQcollection[0] 等中。

当您将本机 DOM 节点记录到控制台时，您将获得 DOM 节点所包含的 HTML。

你真正想要的是使用 jQuery 对象，而不是原生 DOM 节点

var currentTrack = $('span.play-btn[data-play="true"] img');

var attribute = currentTrack.attr('src');
var data-val  = currentTrack.data('id');

如果选择器匹配多个元素，而您只需要获取第一个元素，则可以使用 jQuery 的 eq()

var currentTrack = $('span.play-btn[data-play="true"] img');

var firstTrack = currentTrack.eq(0);

【讨论】：

或者可能是eq()，这取决于 OP 试图通过索引访问 jQuery 对象的原因
我试过这个 currentTrack.eq(0);所以我得到了与开头相同的对象：i.stack.imgur.com/3MxJ3.png，怎么可能（引用自身？）？
这是不可能的，如果currentTrack是一个jQuery对象，currentTrack[0]和currentTrack.eq(0)不会给你相同的值，你发布的图片显示的是jQuery对象，这就是你的想要吗？
我想获取 img 对象，所以从对象中我需要访问索引为 0 的数组，但如果我像 currentTrack.eq(0) 或 currentTrack[0] 一样访问，那么我得到相同的结果 console.log( currentTrack.eq(0)); :D
currentTrack == currentTrack.eq(0) eqval，为什么（选择器没问题？）索引 0，我期望 img 对象

【解决方案2】：

jQuery 元素已“更改为 HTML”，因为您在 jQuery 选择器的末尾添加了 [0]。
这会转换 jQuery object into a native DOM element。

要选择第一个元素，可以使用：

【讨论】：