Entrar Ainda não tem acesso?
1
resposta

[Projeto] Progresso

Referente ao curso JavaScript para Web: Crie páginas dinâmicas, no capítulo Conhecendo o JavaScript e atividade Lista de exercícios

por KEVIN SILVA LOPES
| 22.2k xp | 36 posts
<!DOCTYPE html>
<html>
<head>
    <title>Alerta ao Clique</title>
</head>
<body>
    <button id="meu-botao">Clique-me</button>

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

// Seleciona o botão
const botao = document.getElementById('meu-botao');

// Adiciona um ouvinte de evento de clique ao botão
botao.addEventListener('click', function() {
    // Exibe um alerta na tela
    alert('Fui clicado!');
});

<!DOCTYPE html>
<html>
<head>
    <title>Player de Áudio Personalizado</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="player-container">
        <audio src="audio.mp3" controls></audio>
    </div>
</body>
</html>
1 resposta
por Renan Lima
| 3960.3k xp | 8426 posts
Alura Scuba Team Apoio Educacional - Alura

Olá, Kevin. Tudo bem?

Muito obrigado por compartilhar o seu código aqui com a gente. Parabéns pelo trabalho. Continue com essa dedicação.

Gostei da forma como você usou o addEventListener para adicionar a funcionalidade de alerta ao clique do botão. Isso é uma ótima maneira de trabalhar com interatividade em páginas web!

Uma curiosidade interessante: você sabia que pode personalizar o comportamento do seu botão de forma ainda mais dinâmica, por exemplo, alterando o texto do botão ao ser clicado? Veja como poderia ficar:


botao.addEventListener('click', function() {
    alert('Fui clicado!');
    botao.innerText = 'Clicado!';
});

Esse código altera o texto do botão depois de ele ser clicado, oferecendo uma interação visual bem interessante.

Conte com o apoio do Fórum. Abraços e bons estudos!