Latest web development tutorials

jQuery ottenere e impostare classe CSS

Con jQuery, si può facilmente operare su elementi CSS.

operazione jQuery CSS

jQuery ha diversi metodi di funzionamento CSS. Impareremo la seguente:

  • addClass () - Aggiungere una o più categorie per l'elemento selezionato
  • removeClass () - Cancella uno o più elementi scelti dalla classe
  • toggleClass () - per l'elemento selezionato nella Aggiungi / Rimuovi commutazione di classe
  • CSS () - imposta o restituisce gli attributi di stile

Esempi di fogli di stile

Il seguente foglio di stile sarà utilizzato per tutti gli esempi in questa pagina:

.important
{
font-weight:bold;
font-size:xx-large;
}

.blue
{
color:blue;
}

Metodo jQuery addClass ()

L'esempio seguente mostra come aggiungere un attributo di classe per i diversi elementi. Naturalmente, quando si aggiunge una classe, è anche possibile selezionare più elementi:

Esempi

$("button").click(function(){
$("h1,h2,p").addClass("blue");
$("div").addClass("important");
});

Prova »

È inoltre possibile specificare in addClass () metodo in più categorie:

Esempi

$("button").click(function(){
$("#div1").addClass("important blue");
});

Prova »

Metodo jQuery removeClass ()

L'esempio seguente mostra come eliminare la classe specificata attribuire diversi elementi:

Esempi

$("button").click(function(){
$("h1,h2,p").removeClass("blue");
});

Prova »

Metodo jQuery toggleClass ()

L'esempio seguente mostra come utilizzare il metodo jQuery toggleClass (). Il metodo delle operazioni di elementi selezionati Aggiungi commutazione / Rimuovi classe:

Esempi

$("button").click(function(){
$("h1,h2,p").toggleClass("blue");
});

Prova »

Metodo jQuery css ()

Spiegheremo jQuery css () metodo nel prossimo capitolo.