JavaScript :: Aufgabe #7

1 Lösung Lösung öffentlich

Schere Stein Papier als Browsergame in Javascript

Fortgeschrittener - JavaScript von Programmer21 - 05.05.2019 um 21:42 Uhr
Die Aufgabe ist ein Schere Stein Papier Spiel in Javascript zu Programmieren.
Man soll gegen einen Computer-Gegner spielen.

Lösungen:

vote_ok
von Tobi187 (60 Punkte) - 04.02.2020 um 05:33 Uhr
Quellcode ausblenden HTML-Code
<!DOCTYPE html>
<html>
    <head>
        <title>Website name</title>
        <meta charset="uft-8">
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        
            <h1>Schere Stein Papier</h1>
            <!--input placeholder="What needs to be done?" autofocus id="input-box"-->
            <div class="mitte">
                <input class="toggle" type="checkbox" id="Schere">
                <label>Schere</label>
                <input class="toggle" type="checkbox" id="Stein">
                <label for="input">Stein</label>
                <input class="toggle" type="checkbox" id="Papier">
                <label for="toggle">Papier</label> <br> <br>
                <button id="playbutton">Play</button>
                <br>
                <br>
                <p>Wins <span id="wincounter">0</span></p>
                <p>Loses <span id="losecounter">0</span></p><br><br>
                <button id="newgame">Start a new game</button>
            </div>
            <script lang="javascript" src="scheresteinpapier.js"></script>

            
    </body>
    </html>

Quellcode ausblenden JavaScript-Code
const schere=document.getElementById("Schere")
const stein=document.getElementById("Stein")
const papier=document.getElementById("Papier")
const game2=[schere, stein, papier]

//zufallsprinizp implantieren
const min= 1
const max= 4
//const zufall = Math.floor( Math.random() * (max - min +1 )) +min

schere.addEventListener("click",() => {
    stein.checked=false
    papier.checked=false
})

stein.addEventListener("click",() => {
    schere.checked=false
    papier.checked=false
})

papier.addEventListener("click",() => {
    stein.checked=false
    schere.checked=false
}) 

const playbutton= document.getElementById("playbutton")
let wincounter = 0
let losecounter = 0
const wins = document.getElementById("wincounter")
const loses = document.getElementById("losecounter")
playbutton.addEventListener("click", ()  => {
    //if(schere.checked=true || stein.checked=true || papier.checked=true){
    const zufall = Math.floor( Math.random() * (max - min +1 )) +min
    for( const signs of game2){
        if(zufall<=2){
            wincounter++
            wins.innerText = wincounter
            return alert("Win")
        }
        if(zufall>3){
            losecounter++
            loses.innerText = losecounter
            return alert("Lost")
        }
        if(zufall<=3 && zufall>2){
            /*counter++
            thecounter.innerText = counter*/
            return alert("Draw")
        }
    }
//}
})

const newgame = document.getElementById("newgame")
newgame.addEventListener("click", () => {
    wincounter = 0
    losecounter = 0
    wins.innerText = wincounter
    loses.innerText = losecounter
})