const button = document.querySelector(".button") .addEventListener("click", () => { lista = document.querySelector(".lista"); lista.classList.toggle("show"); });
Obs: Só precisei esconder o conteúdo, utilizando display none, e depois criei uma class "show" essa contém o dislpay: block
Seria uma boa forma para fazer?
Fala, Guilherme! Tudo bem?
Essa é uma boa solução sim. Só diria para você ficar atento as propriedades de display. Você poderia alterar a visibilidade do elemento com o hidden também, é uma outra opção. Por exemplo, display: none retira o elemento do layout da página. Mas você ainda pode continuar manipulando ele no DOM, visibility: hidden deixa de mostrar o elemento, ou seja, ele deixa de ser visível na página mas seu espaço continua ocupado, ou seja, o layout da página não é alterado por causa disto. Depende muito da aplicação que você está desenvolvendo.
Abraços
Ahhhh entendi, vou ter em mente nos próximos projetos. Muito obrigado.