5
respostas

Dúvida de resolução

Olá, tudo bem?

Ainda fiquei com dúvida como resolver, gostaria de entender melhor o funcionamento e a lógica utilizada.

5 respostas

Boa tarde! Tudo bem? Pode informar qual seria a dúvida por gentileza? Fico aguardando seu retorno! :)

Fiquei em dúvida como posso resolver, mesmo tendo a resposta do professor. Gostaria de saber como posso solucionar de forma mais detalhada.

Brigado pelo retorno, Alberinando!

Do primeiro bloco de código:

A const lista, serve para referenciar a ul, utilizando o método querySelector.

A segunda linha do código faz a mesma coisa, só que referenciando o botão, com o id botao, e criando um evento de clique.

Poderia escrever também parecido com a linha de cima, da seguinte forma:

const botao = document.querySelector("#botao") botao.addEventListener("click", () => {

Dentro do método addEventListener, é passado o que deve acontecer com o clique. Que é alterar algum atributo, com o método setAttribute, de "data-lista", para "mostrar".

Esses são os data attributes no arquivo CSS:

`[data-lista="mostrar"] { display: block; }

[data-lista="esconder"] { display: none; }`

Do segundo bloco de código:

Faz a mesma coisa, só que clicando no botão com a classe "close".

Detalhe importante, para passar o que deve "acontecer", é muito comum unir arrow function + métodos da linguagem. Como no exemplo acima.

Consegui ajudar em sua dúvida? Caso ainda persista, pode me informar por favor?

E se consegui ajudar, pode marcar o tópico como respondido por favor?

Bons estudos! :)

Vou ser sincero: Faltou sobre os data-attributes. Me matei no exercício, acabei chegando ao resultado de outra forma (modificando o texto com innerText), mas ao consultar a resposta do exercício, faltou o que você adicionou no CSS e faltou também as alterações que foram feitas no HTML. Seria melhor se trouxesse essas informações na resposta do exercício, não apenas o código JS. Fora que, nessa altura do curso, ainda não foi ensinado a respeito de data-attributes e eu não fazia ideia de como manipular os data-attributes pelo CSS. Enfim, consegui aprender, mas bem bagunçado essa parte...

Olá, Jair. Como vai?

Obrigado pelo seu feedback, dicas para melhorar o conteúdo são sempre bem-vindas! :)

Eu vou deixar na resposta do exercício, a explicação que havia dado ao aluno nesse tópico.

Sobre a explicação sobre "data-attributes", nessa mesma, aula possui um conteúdo extra explicando sobre ele, e também um exercício de múltipla escolha, antes desse exercício de desafio ao final da aula.

Caso surjam mais dúvidas, pode contar com a gente!

Bons estudos! :)