2013-05-21 13 views
5

io corsi in questa linea di codice e non riesco a capire cosa significa:Cosa significa parentesi e parentesi dopo il selettore jquery?

$("#theAppContainer")[s > u ? "addClass" : "removeClass"]("something"); 

comprendo la prima parte è selezionando l'elemento chiamato theAppContainer e la seconda parte restituisce "addClass" se s> tu, ma non riesco a capire cosa faccia questa linea di codice nel complesso.

+1

È un operatore ternario, come un if/else, quindi se 's' è maggiore di' u', quindi selezionare addClass ecc. – adeneo

+3

Come nota a margine, va notato che toggleClass ha un interruttore, quindi potresti semplicemente do '$ (" # theAppContainer "). toggleClass ('qualcosa', s> u);' – adeneo

risposta

13

The bracket syntax gets the value of a property by name, e le parentesi chiamare la funzione che è il valore di quella proprietà. È equivalente a:

var container = $('#theAppContainer'); 

if(s > u) { 
    container.addClass('something'); 
} else { 
    container.removeClass('something'); 
} 

Inoltre, per favore non scrivere mai un codice del genere. =)

Inoltre anche, toggleClass prende un secondo switch argomento che è possibile utilizzare invece:

$('#theAppContainer').toggleClass('something', s > u); 
+0

Mi piace molto il ternario, ma in questo caso, è un po 'ridicolo haha, d'accordo! –

+0

Non so, mi piace un po '. Non è nemmeno il pezzo più folle del single-liner JQuery che ho visto! [Dal punto di vista delle prestazioni] (http://jsperf.com/ternary-vs-if-using-jquery), almeno, sono quasi identici. –

+1

@SandyGifford: le prestazioni dovrebbero essere l'ultimo punto da considerare! Ad ogni modo, ho aggiunto il modo jQuery-esque di fare le cose. Grazie per avermi fatto sembrare :) – Ryan

5

$("#theAppContainer") restituisce un oggetto jquery.

jqueryObject["addClass"] è sinonimo di jqueryObject.addClass

Quindi, jqueryObject["addClass"] restituisce il metodo addClass sull'oggetto jQuery.

Quindi si utilizza ("something") per passare i parametri in ed eseguire il metodo.

Così si sta facendo in sostanza

var myJqueryObject = $("#theAppContainer"); 
if(s > u) { 
    myJqueryObject.addClass("something"); 
} 
else { 
    myJqueryObject.removeClass("something"); 
} 
1

parentesi quadra notazione.

$('#element')['hide'](700)

Dot notazione:

$('#element').hide(700)

l'altra cosa (?:) è chiamato ternary operator

che fa un confronto dichiarazione che restituisce un valore booleano,
Dove s>u è una dichiarazione, e in funzione del risultato vengono utilizzati i valori:

STATEMENT ? IF TRUE USE THIS : IF FALSE USE THAT ;

se s > u uso 'addClass' altro 'removeClass'
che significa che riceverai $("#theAppContainer")["addClass"]("something"); se s > u e $("#theAppContainer")["removeClass"]("something"); se s===u || s<u
che può essere tradotto in DOT notazione:

$("#theAppContainer").addClass("something"); 

o

$("#theAppContainer").removeClass("something"); 

Questo non è il modo migliore per farlo, perché è possibile utilizzare toggleClass() metodo in questo caso particolare, ma qualsiasi è bello saperlo.
E non è vero che non si dovrebbe usare la notazione della parentesi. Nel JS avanzato vedrai tutti i vantaggi.

+0

Se stai parlando della mia risposta, non ho mai detto di non usare mai la notazione della parentesi. In questo caso è solo una scelta sciocca. – Ryan

Problemi correlati