L'ordine di una classe su un selettore è importante? Se sì, posso specificare l'ordine?

Question

C'è una differenza tra:

<span id="test" class="one two"></span> 

e

<span id="test" class="two one"></span> 

Se ci sono conflitti delle regole dei CSS su queste classi fa la questione ordine?

Esistono API in jQuery da riordinare? Quando chiamo addClass() finisce sempre?

Answer 1

L'ordine non ha importanza.

http://jsfiddle.net/rc8Yu/

css precedence

La parte importante qui è

Se due regole sono uguali in tutto quanto sopra, quello dichiarato ultime vittorie. CSS incorporato nel codice HTML sempre dopo fogli di stile esterni, indipendentemente dall'ordine in html

Answer 2

L'ordine delle classi in HTML no non importa, ma l'ordine all'interno del CSS non importa. Ad esempio, se si ha:

span.one { color: red } 
span.two { color: blue } 

Entrambi si estende con class="one two" e class="two one" produrrebbe testo blu, perché la classe "due" è definito per ultimo. Ma se abbiamo cambiato che a

span.two { color: blue } 
span.one { color: red } 

e ha fatto la stessa cosa, entrambe le campate sarebbe ora avere un testo rosso perché "uno" classe è definita scorso. Anche tenere a mente che l'ID avrà la precedenza entrambe le classi non importa cosa, quindi se ho definito:

span#test { color: green } 

e ha aggiunto id="test", poi le campate avranno sempre testo in verde, non importa dove nel documento le classi e Il selettore di ID è definito, perché un ID è naturalmente più specifico di una classe (altre istanze possono rendere una classe più specifica di un ID, ecc.).

---

Poiché ciò è vero, l'ordine delle classi assegnato da jQuery è completamente irrilevante. Non dovresti preoccuparti di riordinarli, ma sì, addClass aggiunge semplicemente la classe alla fine dell'elenco.

Answer 3

Se si utilizza la proprietà DOM classList, l'ordine è significativo.

L'oggetto restituito ha le classi impostate come proprietà numeriche; ordine crescente come i nomi delle classi da sinistra a destra.

jsFiddle.