[Projeto] PROJETO MAO NA MASSA | JavaScript: manipulando elementos no DOM

<!DOCTYPE html>
<html>
<head>
    <title>Fokus</title>
</head>
<body>
    <div id="temporizador">25:00</div>
    <div id="imagens-contexto"></div>
    <div id="frases-contexto"></div>
    <button id="botao-iniciar">Iniciar</button>
    <button id="botao-foco">Foco</button>
    <button id="botao-descanso-curto">Descanso curto</button>
    <button id="botao-descanso-longo">Descanso longo</button>

    <script src="script.js"></script>
</body>
</html>


// Selecionando elementos do HTML
const documentoHTML = document.documentElement; // ou document.querySelector('html');
const temporizador = document.getElementById('temporizador');
const imagensContexto = document.getElementById('imagens-contexto');
const frasesContexto = document.getElementById('frases-contexto');




// Selecionando elementos do HTML
const documentoHTML = document.documentElement;
const temporizador = document.getElementById('temporizador');
const imagensContexto = document.getElementById('imagens-contexto');
const frasesContexto = document.getElementById('frases-contexto');

// Verificando as variáveis no console
console.log(documentoHTML);
console.log(temporizador);
console.log(imagensContexto);
console.log(frasesContexto);



// Selecionando elementos do HTML
const documentoHTML = document.documentElement;
const temporizador = document.getElementById('temporizador');
const imagensContexto = document.getElementById('imagens-contexto');
const frasesContexto = document.getElementById('frases-contexto');

// Verificando as variáveis no console
console.log(documentoHTML);
console.log(temporizador);
console.log(imagensContexto);
console.log(frasesContexto);

// Criando variáveis para os botões
const botaoIniciar = document.getElementById('botao-iniciar');
const botaoFoco = document.getElementById('botao-foco');
const botaoDescansoCurto = document.getElementById('botao-descanso-curto');
const botaoDescansoLongo = document.getElementById('botao-descanso-longo');

// Verificando as variáveis dos botões no console
console.log(botaoIniciar);
console.log(botaoFoco);
console.log(botaoDescansoCurto);
console.log(botaoDescansoLongo);

// Selecionando elementos do HTML
const documentoHTML = document.documentElement;
const temporizador = document.getElementById('temporizador');
const imagensContexto = document.getElementById('imagens-contexto');
const frasesContexto = document.getElementById('frases-contexto');

// Verificando as variáveis no console
console.log(documentoHTML);
console.log(temporizador);
console.log(imagensContexto);
console.log(frasesContexto);

// Criando variáveis para os botões
const botaoIniciar = document.getElementById('botao-iniciar');
const botaoFoco = document.getElementById('botao-foco');
const botaoDescansoCurto = document.getElementById('botao-descanso-curto');
const botaoDescansoLongo = document.getElementById('botao-descanso-longo');

// Verificando as variáveis dos botões no console
console.log(botaoIniciar);
console.log(botaoFoco);
console.log(botaoDescansoCurto);
console.log(botaoDescansoLongo);

// Criando variáveis para os tempos dos temporizadores
const tempoFoco = 1500;
const tempoDescansoCurto = 300;
const tempoDescansoLongo = 900;

// Verificando as variáveis dos tempos no console
console.log(tempoFoco);
console.log(tempoDescansoCurto);
console.log(tempoDescansoLongo);