PauloRB.dev

Desenvolvedor de Software

Adicionar e remover classes CSS com Vanilla Javascript | PauloRB.dev Adicionar e remover classes CSS com Vanilla Javascript – PauloRB.dev
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');

Mais Posts

Jogo da Velha com HTML, CSS e JavaScript

Jogo da Velha com HTML, CSS e JavaScript

Vamos hoje desenvolver uma atividade que é comum em alguns testes de programação onde iremos desenvolver um simples jogo da... Leia mais

Um resumo sobre o WSL2

Um resumo sobre o WSL2

O WSL 2 (Windows Subsystem for Linux) representa um grande avanço na integração entre o Windows e o Linux, permitindo... Leia mais

Manipulando dados de arrays com o método ‘pluck’ em coleções do Laravel

Manipulando dados de arrays com o método ‘pluck’ em coleções do Laravel

O Laravel é um dos frameworks de desenvolvimento web mais populares e poderosos em uso atualmente. Ele tem muitas características... Leia mais

Onde aprender React ?

Onde aprender React ?

Vamos lá! Em um dia qualquer estava eu a rolar o feed do Linked-In e um determinado post me chamou... Leia mais