Селекторы jQuery возвращают массив элементов HTML или объектов jQuery?

Что хранится в Q?

Q = $('div');
Q2 = document.getElementsByTagName('div');

Я могу получить доступ к каждому элементу HTML, используя Q[index], подобно Q2[index]; что делает его похожим на Q - это массив элементов HTML.

С другой стороны, я могу сделать Q.filter(), но я не могу сделать Q2.filter(); что делает его похожим на Q - массив объектов jQuery.

Или это так, где Q - объект jQuery, содержащий кучу элементов HTML? Если бы это было так, не было бы console.log() обнаруживать Q как объект с коллекцией объектов внутри него? Эта скрипта, http://jsfiddle.net/rkw79/3s7tw/, показывает, что они одинаковы.

Примечание. Я знаю, что Q.eq(index) вернет объект, который может использовать методы jQuery. Мне просто интересно, что именно есть Q

Ответ 1

Результатом является объект jQuery, который ведет себя как массив HTMLElements, который вы используете с помощью [] и array объектов jQuery, которые вы используете с помощью eq(index);

Ответ 2

В вашем примере q (объект jQuery) представляет собой объект, подобный массиву, который фактически является оберткой вокруг набора выбранных узлов DOM. Рассмотрим этот пример:

HTML:

<div id="example"></div>

JS:

alert($("#example")) //Alerts something like "Object"
alert($("#example")[0]) //Alerts something like "HTMLDivElement"
alert(document.getElementById("example")); //Alerts something like "HTMLDivElement"

Второй пример выше обращается к первому необработанному элементу DOM в коллекции (в этом случае есть только один). Вы можете добиться того же, используя метод jQuery get(index), но я использовал синтаксис обычного массива, чтобы продемонстрировать, что объект jQuery похож на массив.

Объект-оболочка jQuery - это то, что позволяет применять другие методы jQuery к согласованному набору элементов. У самих элементов DOM эти методы отсутствуют, поэтому в вашем примере Q2.filter() не работает.

Q2 является сырым элементом DOM. Поскольку объект jQuery является фактически оберткой вокруг набора элементов DOM, это вполне возможно сделать:

alert($(document.getElementById("example"))); //Alerts something like "Object"

В этом примере getElementById возвращает элемент DOM, который затем передается в функцию jQuery, которая возвращает объект типа jQuery, подобный массиву, что позволяет вам вызывать другие методы jQuery.

Ответ 3

Q - объект. Он обманывает и претендует на то, чтобы быть массивом, реализующим все обычные функции массива, поэтому firebug обрабатывает его таким образом. (Или, может быть, он начинается как массив, но с добавлением материала.)

Он содержит стек со всеми предыдущими выбранными элементами (так что вы можете использовать .end()), у него есть фактический массив согласованных элементов, и что об этом.

Try:

for(i in $('body')) console.log(i)

И вы увидите все функции и т.д.