day30/25.html at main · githubber-me/day30 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rock-Paper-Scissors Game</title>
</head>
<body>
    <h1>Rock-Paper-Scissors Game</h1>
    <button onclick="playGame('rock')">Rock</button>
    <button onclick="playGame('paper')">Paper</button>
    <button onclick="playGame('scissors')">Scissors</button>
    <p id="result"></p>

    <script>
        function playGame(userChoice) {
            const choices = ['rock', 'paper', 'scissors'];
            const computerChoice = choices[Math.floor(Math.random() * choices.length)];
            const resultElement = document.getElementById('result');

            if (userChoice === computerChoice) {
                resultElement.textContent = 'It\'s a tie!';
            } else if (
                (userChoice === 'rock' && computerChoice === 'scissors') ||
                (userChoice === 'paper' && computerChoice === 'rock') ||
                (userChoice === 'scissors' && computerChoice === 'paper')
            ) {
                resultElement.textContent = `You win! Computer chose ${computerChoice}.`;
            } else {
                resultElement.textContent = `You lose! Computer chose ${computerChoice}.`;
            }
        }
    </script>
</body>
</html>