Olá Pedro! Tudo bem contigo?
Na sua função eliminaItem(), você está corretamente recuperando os valores do Local Storage através do método getItem() e convertendo-os de volta para objetos JavaScript com JSON.parse(). No entanto, parece que você está comparando o valor de dado1Storage com o número 4, o que pode ser o problema.
Se o valor armazenado em dado1 for uma string contendo o número 4, você precisa fazer a comparação utilizando aspas, como por exemplo if (dado1Storage === "4"). Caso contrário, se o valor armazenado for um número, você pode fazer a comparação diretamente, sem a necessidade de conversão para string.
Além disso, para remover a classe "elemento-5" do elemento selecionado, você precisa utilizar o método classList.remove() no elemento em si, não na classe. Então, ao invés de elemento5.classList.remove("elemento-5"), você pode simplesmente utilizar elemento5.classList.remove("elemento-5").
Aqui está um exemplo de como ficaria a sua função corrigida:
function eliminaItem() {
const dado1Storage = JSON.parse(localStorage.getItem("dado1"))
const dado2Storage = JSON.parse(localStorage.getItem("dado2"))
var elemento5 = document.querySelector('.elemento-5')
if (dado1Storage === "4") {
elemento5.classList.remove("elemento-5")
}
}
Espero que isso resolva o seu problema!
Se tiver mais alguma dúvida, é só me dize.
Espero ter ajudado e bons estudos!
Olá, Pedro, tudo bem?
Primeiramente, parabéns pelo seu projeto pessoal e por estar buscando aprender mais sobre manipulação do DOM! Compreendo que você está enfrentando uma dificuldade ao utilizar os dados armazenados no local storage para manipular o DOM. Vou te ajudar a entender o problema e propor uma solução.
Ao analisar o código que você compartilhou, percebo que a abordagem está quase correta, mas há um pequeno equívoco na forma como você está verificando o valor do dado1Storage para remover a classe "elemento-5" do elemento correspondente.
Vamos analisar o trecho de código em que você tenta eliminar a classe:
function eliminaItem() {
const dado1Storage = JSON.parse(localStorage.getItem("dado1"))
const dado2Storage = JSON.parse(localStorage.getItem("dado2"))
var elemento5 = document.querySelector('.elemento-5')
if (dado1Storage === 4) {
elemento5.classList.remove("elemento-5")
}
}
A variável dado1Storage recebe o valor recuperado do local storage através da chave "dado1", e o mesmo ocorre com a variável dado2Storage. Até aqui, tudo bem!
O problema está na condição do if: if (dado1Storage === 4). Você está comparando o valor de dado1Storage com o número 4. No entanto, ao alocar o dado no local storage, você o converteu em uma string JSON usando JSON.stringify(). Isso significa que, ao recuperá-lo, você precisa fazer o processo reverso, ou seja, usar JSON.parse() para transformar a string JSON em um objeto JavaScript novamente.
Para resolver esse problema, você precisa ajustar a condição do if para verificar o valor correto do dado1Storage. Se você estiver usando uma estrutura de objeto para armazenar os dados, pode ser algo assim:
// Armazenando os dados como objeto
const dado1Value = { valor: 4 };
localStorage.setItem('dado1', JSON.stringify(dado1Value));
E, na função eliminaItem(), você pode verificar o valor correto assim:
function eliminaItem() {
const dado1Storage = JSON.parse(localStorage.getItem("dado1"));
const dado2Storage = JSON.parse(localStorage.getItem("dado2"));
var elemento5 = document.querySelector('.elemento-5');
if (dado1Storage.valor === 4) {
elemento5.classList.remove("elemento-5");
}
}
Agora a condição if (dado1Storage.valor === 4) verifica corretamente o valor do dado1Storage e, se for igual a 4, a classe "elemento-5" será removida do elemento correspondente.
Lembre-se de que, no exemplo acima, estamos considerando que você está armazenando os dados como um objeto com uma propriedade "valor" contendo o valor 4. Você pode ajustar a estrutura de objeto conforme a necessidade do seu projeto.
Espero que essa explicação tenha sido clara e que agora você consiga manipular o DOM com os dados do local storage. Se surgirem mais dúvidas, não hesite em perguntar. Continue estudando e praticando, e você alcançará ótimos resultados em seu projeto pessoal!
Espero que tenha te ajudado, bons estudos!
