jQuery-.first（）与[0]元素

Question

Using jQuery 3.1.1, why are the results of these two different?

$('dd[data-something]').first().innerText;

^ returns undefined

$('dd[data-something]')[0].innerText;

^ returns valid data

Wouldn't the 0th element of an array also be the .first() element?

Edit : Thanks all, I got it, jQuery object versus DOM element. As the debugger clearly showed before I could delete this :) That's a clear sign its time to call it quits for the day.

Answer 1

因为first返回一个jQuery对象，该对象围绕该集合中的第一个原始DOM元素包装（它没有innerText属性，但确实具有该便捷的text方法），并且[0]直接访问该原始DOM元素（该对象确实具有一个innerText属性）大多数浏览器）。

Answer 2

first() will return a jQuery object which is different from the normal JavaScript object and won't work with native JavaScript APIs, here's a qoute from the official documentation

the .first() method constructs a new jQuery object from the first element in that set.

The second one (index zero) will return a JavaScript object it's almost like calling the element using querySelectorAll()

So if you want to get the text use text() from jQuery and it will work

$('dd[data-something]').first().text('new text'); // this will change the text