¿Cuál es la diferencia entre $ (esto) y esto en jQuery?

Question

¿Cuál es la diferencia entre $(this) y this en jQuery, y por qué a veces dan el mismo resultado y otras veces se comportan de manera diferente?

Answer 1

$(this) envuelve this con la funcionalidad jQuery.

Por ejemplo, este código podría fallar:

$('.someDiv').onClick(function(){ 
    // this refers to the DOM element so the following line would fail 
    this.fadeOut(100); 
}); 

Así que envuelven this en jQuery:

$('.someDiv').onClick(function(){ 
    // wrap this in jQuery so we can use jQuery fadeOut 
    $(this).fadeOut(100); 
}); 

Answer 2

Si en su contexto actual si el this no es un objeto jQuery, puede hacer es un elemento jQuery al envolverlo alrededor de $(). Cuando su elemento ya es un resultado de la expresión jQuery, el this en ese caso ya es un objeto jQuery. Entonces, en ese caso, ambos funcionan de manera similar

Answer 3

$(this) decora cualquier objeto this puntos con las funciones jQuery. El caso de uso típico es para this para hacer referencia a un elemento DOM (por ejemplo, un <div>). Luego, escribir $(this) le permite usar todas las funciones de API de jQuery en ese <div>.

Si this ya se refiere a un objeto jQuery, normalmente un objeto DOM decorado con jQuery, entonces llamar al $(this) no tendrá ningún efecto porque ya está decorado.

Answer 4

this es una variable de javascript creada siempre que se encuentre dentro de una función que está unida a un objeto. En estos casos, this se refiere a ese objeto.

$(this) devuelve un objeto jQuery al que puede llamar funciones jQuery, pero se aplicará solo a this.

Por ejemplo, si se establece un controlador de clic para todos los anclajes:

$('a').click(function() { 
    console.log(this.href) ; 
}) ; 

entonces el this, se refiere al anclaje, que el evento click (función) está conectada.

Answer 5

que comprenda un poco mejor, se consigue un depurador de somekind como Google Chrome y hacer esto ..

$('a').click(function(){ 
    console.log(this); //DO 
    console.log($(this)); //JO 
}); 

esto le mostrará cuál es la diferencia :)

Answer 6

En JavaScript esto siempre se refiere al "propietario" de la función que se está ejecutando. Al usar $ (esto) solo se ajustará el propietario para que todas las operaciones de jQuery se extiendan y estén disponibles.

considerar:

$links = $('#content a'); 

$links.click(function() { 
    link = this; 
    $link = $(this); //jQuery wrapped object. 

    alert(link.getAttribute('href'));   
    alert($link.attr('href')); //we can use the attr() function from jQuery 
}); 

suelen dar los mismos resultados ya que el propietario es el mismo, sólo que cuando se envuelve por jQuery que puede operar con las funciones de jQuery.

Answer 7

$ (esto) == esto? interesante.

esto no debe pasar por el evento DOM.