Solucionado
No desafio 2, na sugestão tem:
// Inicializa a contagem considerando que os jogos já começam alugados
document.addEventListener('DOMContentLoaded', () => {
jogosAlugados = document.querySelectorAll('.dashboard__item__img--rented').length;
contarEExibirJogosAlugados();
});
Poderia explicar melhor essa parte aqui ?
Olá, Marcelo!
Claro, posso explicar essa parte do código para você.
Este trecho de código é um evento que é acionado quando todo o conteúdo do documento HTML é carregado no navegado. Isso é feito através do método addEventListener com o evento DOMContentLoaded. Ou seja, quando a página for carregada no navegador, é o próprio navegador que vai disparar esse evento chamado DOMContentLoaded e com isso o trecho de código será executado:
document.addEventListener('DOMContentLoaded', () => {
jogosAlugados = document.querySelectorAll('.dashboard__item__img--rented').length;
contarEExibirJogosAlugados();
});
Agora, vamos entender o que acontece dentro dessa função:
jogosAlugados = document.querySelectorAll('.dashboard__item__img--rented').length;Nesta linha, estamos selecionando todos os elementos que têm a classe .dashboard__item__img--rented e, em seguida, obtendo o número desses elementos usando a propriedade .length. Isso nos dá o número de jogos que foram alugados.
contarEExibirJogosAlugados();Aqui, estamos chamando a função contarEExibirJogosAlugados(). Essa função, que não está incluída no trecho de código que você postou, provavelmente é responsável por atualizar a interface do usuário com o número de jogos alugados.
Então, basicamente, esse código está configurado para contar o número de jogos alugados assim que a página é carregada e, em seguida, atualizar a interface do usuário com essa informação.
Espero ter ajudado e bons estudos!