Adicionar e remover classes CSS com Vanilla Javascript

Adicionar e remover classes CSS com Vanilla Javascript
Adicionar e remover classes CSS com JQUERY é uma atividade muito simples, mas também através do javascript puro conseguimos o mesmo efeito e com as mesma simplicidade. Todo elemento do DOM possui uma propriedade classlist que é basicamente o ponto de entrada para se obter e configurar as classes CSS desse Elemento como podemos ver abaixo: var classes = document.querySelector("#container").classList; Adicionando uma classe CSS: Uma classe CSS pode se adicionada da seguinte forma mas se a classe já existir ela será ignorada: document.querySelector("#container").classList.add('post-image'); Várias classes CSS podem ser adicionadas passando vários parâmetros: // add class "post" & "post-image" to #container document.querySelector("#container").classList.add('post', 'post-image'); Removendo uma classe CSS // remove class "post" & "post-image" from #container document.querySelector("#container").classList.remove('post-image'); // remove class "post" & "post-image" from #container document.querySelector("#container").classList.remove('post', 'post-image');

Comentários (0)

Nenhum comentário ainda. Seja o primeiro.

Continue lendo

Alterar função ONCLICK de um botão com JavaScript Vanilla

Alterar função ONCLICK de um botão com JavaScript Vanilla

Vamos lá a mais um estudo de caso. Na tela abaixo temos um crud simples cujo frontend foi feito com Vanilla JavaScript e assim surgiu-se a necessidade de que ao clicar no botão atualiza o evento ONCLICK do botão…

Artigo, FrontEnd, JavaScript, Tutorial