Kleiner JavaScript Kurs

Zufallszahlen (Würfel_1)

Jetzt wollen wir unser Ein-, Ausgabe - Beispiel für die Programmierung eines Würfels verwenden.
Die beiden Eingabefelder benötigen wir nicht mehr (bitte im HTML- und im JavaScript Quelltext löschen).
Zufallszahlen kann man in JavaScript mit der Funktion Math.random() erzeugen (eine Zahl zwischen 0 und 0,999999)


<!DOCTYPE html>
<html lang="de">
   <head>
        <meta charset="utf-8">
        <title>JavaScript Kurs; Zufallszahlen (Würfel_1)</title>
        <script type="text/javascript">
            function Wuerfel_1(){
             var Zufallszahl;
             var Ausgabe=document.getElementById('meinAusgabefeld');
             Zufallszahl=Math.random();
             Ausgabe.innerHTML = Zufallszahl;
            }
        </script>
   </head>
   <body>
        <h1>JavaScript Kurs; Zufallszahlen (Würfel_1)</h1>
        <!-- Schaltfläche auf HTML Seite; onclick Ereignis startet JavaScript  -->
        <input type="button" value="Würfeln" onclick="Wuerfel_1();" /><br>
         <!-- Ausgabe auf HTML Seite; ID=meinAusgabefeld-->
        <h2><output id="meinAusgabefeld"></output></h2>
   </body>
</html>

So könnte es aussehen: JS_Kurs_B04.html


Um die Zahl in den Bereich zwischen 1 und 6 zu bekommen, müssen wir etwas rechnen.
Zunächst multiplizieren wir die Zufallszahl mit 6 (ergibt Zahlen zwischen 0 und 5,9999) und runden dann auf die nächste Ganzzahl auf (Math.ceil())


<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8">
    <title>JavaScript Kurs; Zufallszahlen (Würfel_1)</title>
    <script type="text/javascript">
        function Wuerfel_1() {
            var Zufallszahl;
            var Ausgabe = document.getElementById('meinAusgabefeld');
            Zufallszahl = Math.random();
            Zufallszahl = Math.ceil(Zufallszahl * 6);
            Ausgabe.innerHTML = Zufallszahl;
        }
    </script>
  </head>

  <body>
    <h1>JavaScript Kurs; Zufallszahlen (Würfel_1)</h1>
    <!-- Schaltfläche auf HTML Seite; onclick Ereignis startet JavaScript  -->
    <input type="button" value="Würfeln" onclick="Wuerfel_1();" />
    <br>
    <!-- Ausgabe auf HTML Seite; ID=meinAusgabefeld-->
    <h2><output id="meinAusgabefeld"></output></h2>
  </body>
</html>

So könnte es aussehen: JS_Kurs_B04a.html