Latest web development tutorials

jQuery obter e definir classe CSS

Por jQuery, ele pode facilmente operar em elementos CSS.

operação jQuery CSS

jQuery tem vários métodos de operação CSS. Vamos aprender o seguinte:

  • addClass () - Adicione uma ou mais categorias ao elemento selecionado
  • removeClass () - Exclui um ou mais elementos seleccionados a partir da classe
  • toggleClass () - para o elemento selecionado no Add / Remove operação de troca de classe
  • css () - Define ou retorna atributos de estilo

Exemplos de folhas de estilo

O seguinte estilo vai ser utilizado para todos os exemplos desta página:

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

.blue
{
color:blue;
}

jQuery addClass () Método

O exemplo a seguir mostra como adicionar um atributo de classe para os diferentes elementos. Claro que, quando você adicionar uma classe, você também pode selecionar vários elementos:

Exemplos

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

tente »

Você também pode especificar em addClass () em várias categorias:

Exemplos

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

tente »

jQuery removeClass () Método

O exemplo a seguir mostra como excluir a classe especificada atribuir diferentes elementos:

Exemplos

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

tente »

jQuery toggleClass () Método

O exemplo a seguir mostra como usar o método jQuery toggleClass (). O método de operação elementos selecionados Adicionar comutação / Remover classe:

Exemplos

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

tente »

jQuery css () Método

Vamos explicar jQuery css () no próximo capítulo.