jquery questo contro $ (questo) e forse anche $ questo

Question

Spesso vedo esempi di utilizzo della parola chiave this in jquery. A volte lo vedo usato con $ e parentesi, altre volte senza. E pensavo di averlo visto usato con un po 'di ciascuno.

Quindi,

var id = this.attr('id'); 

var id = $(this).attr('id'); 

var id = $this.attr('id'); 

Sono qui tutti lo stesso? C'è un modo preferito? È this una cosa javascript e $(this) una cosa jQuery? In tal caso, dove cade $this?

So che questa è probabilmente una domanda per principianti, ma non sono riuscito a ottenere il semplice, this, da solo, per funzionare. Posso solo far funzionare $(this). Non sono sicuro se sto facendo qualcosa di sbagliato, o se ho letto esempi con errori di battitura.

Answer 1

this è una cosa JavaScript. Si riferisce al "contesto" in cui una funzione è in esecuzione. Per la maggior parte dei gestori di eventi, è l'elemento DOM ("raw") che sta ascoltando un evento. In altre situazioni significherà altre cose; Googling "this in JavaScript" potrebbe essere illuminante.

---

Io dico che è l'elemento "grezzo" DOM ​​perché jQuery è spesso usato per involucro elementi DOM pianura in un involucro jQuery, in modo da poter utilizzare i metodi di jQuery come attr al posto di quelli usuali (getAttribute, setAttribute, ecc.). Questo wrapping è realizzato con la funzione $, ed è qui che vedi $(this). Ad esempio:

this.getAttribute("href") 
/* or */ someElement.getAttribute("href") 

è uguale

$(this).attr("href") 
/* or */ $(someElement).attr("href") 

---

$this o this$ è solo un nome variabile.Ma, è spesso convenzionale, per fare un incarico come

var $this = $(this); 

La ragione di questo è quello di evitare di invocare continuamente la funzione $, che è un po 'costoso in quanto crea un nuovo oggetto wrapper jQuery ogni volta. Se memorizzi l'elemento avvolto in una variabile, guadagni leggermente in efficienza.

---

In rari casi, this potrebbe già essere un wrapper jQuery. Il caso che emerge spesso per me è quando si scrivono i plugin jQuery. In tal caso puoi fare cose come this.attr("id") direttamente, senza avvolgerlo prima, perché è già stato spostato. Nei casi normali (gestori di eventi, $.each, ecc.) È necessario il wrapper.

Answer 2

this è un oggetto Javascript nativo che fa riferimento all'oggetto corrente. Nelle funzioni jQuery definite con jQuery.fn., this è un oggetto jQuery di per sé. $(this) è il modo di jQuery di trasformare un Javascript this in un oggetto jQuery. E $this è solo un nome di variabile. Se non lo hai definito, sarebbe undefined.

Ecco una buona spiegazione di utilizzo del this di jQuery:

http://www.learningjquery.com/2007/08/what-is-this

Answer 3

'questo' è un oggetto parola chiave Javascript per fare riferimento all'oggetto corrente, '$ (this)' è la funzione wrapper jQuery che trasforma l'oggetto corrente in un oggetto jQuery e quando vedi '$ this' di solito si riferisce a una variabile creata dallo sviluppatore per fare riferimento all'oggetto $ (this), è utile durante un ciclo $ .each. Ad esempio:

$(function(){ 
    $('a').click(function(){ 
    var $this = $(this); // refers to the $('a') object 
    $('div').each(function(){ 
     $(this).hide(); // $(this) refers to each 'div' in the loop, not the $('a') 
     $this.css({ color: 'blue' }); // turns the link element text blue 
    }); 
    }); 
}); 

Answer 4

anziché chiamare $(this) più volte, è più efficiente archiviarlo come variabile, solitamente chiamato $this in modo che le persone sappiano di cosa si tratta.