2011-08-09 14 views
17

¿Qué se almacena en Q?¿Los selectores jQuery devuelven una matriz de elementos HTML o objetos jQuery?

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

puedo acceder a cada elemento HTML utilizando Q[index], similar a Q2[index]; lo que hace que parezca que Q es una matriz de Elementos HTML.

Por otro lado, puedo hacer Q.filter(), pero I no puede do Q2.filter(); lo que hace que parezca que Q es una matriz de objetos jQuery.

¿O es ambos, donde Q es un objeto jQuery que contiene un grupo de elementos HTML? Si este fuera el caso, ¿no detectaría console.log()Q como un objeto con una colección de objetos dentro de él? Este violín, http://jsfiddle.net/rkw79/3s7tw/, muestra que son iguales.

Nota: Soy consciente de que Q.eq(index) devolverá un objeto que puede usar métodos jQuery. Me pregunto qué es exactamente Q

Respuesta

3

Q es un objeto. Hace trampa y pretende ser una matriz implementando todas las funciones de matriz habituales, por lo que Firebug lo trata de esa manera. (O tal vez comienza como una matriz, pero con cosas añadidas.)

Contiene una pila con todos los elementos seleccionados previamente (para que pueda usar .end()) tiene una matriz real de los elementos coincidentes, y eso es todo .

Probar:

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

Y verá todos los funciones, etc.

13

El resultado es un objeto que se comporta como jQuery tanto una serie de HTMLElements que se consigue utilizando [] y un array de jQuery Objetos que obtiene usando eq(index);

+1

También me gustaría señalar que el iterador 'Q.each()' pasa el objeto HTMLElement a la devolución de llamada, ya que itera a través de Q como si fuera una matriz. Esto fue algo inesperado para mí cuando usé jQuery por primera vez, aunque tiene mucho sentido si entiendes que lo está tratando como una matriz. – Charles

6

En su ejemplo, q (el objeto jQuery) es un array -como objeto, que es efectivamente una envoltura alrededor de la serie de nodos DOM seleccionados. Considere este ejemplo:

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" 

El segundo ejemplo anterior accede al primer elemento DOM prima en la colección (en este caso, sólo hay una). Puede lograr lo mismo utilizando el método jQuery get(index), pero utilicé la sintaxis de matriz normal para demostrar que el objeto jQuery es similar a una matriz.

El objeto envoltorio jQuery es lo que le permite aplicar otros métodos jQuery al conjunto de elementos coincidentes. Los elementos DOM por sí mismos no tienen esos métodos, por lo que en su ejemplo Q2.filter() no funciona.

Q2 es un elemento DOM sin procesar.Como un objeto jQuery es efectivamente una envoltura alrededor de un conjunto de elementos DOM, es totalmente posible hacer esto:

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

En ese ejemplo getElementById, devuelve el elemento DOM, que se pasa luego en la función jQuery, que devuelve el objeto jQuery similar a una matriz, permitiéndole llamar a otros métodos jQuery.