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)
<html> <head> <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="submit" value="Würfeln" onclick="Wuerfel_1();" /><br> <!-- Ausgabe auf HTML Seite; ID=meinAusgabefeld--> <font color="#0000FF"><h1 id="meinAusgabefeld"></h1></font> </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())


<html> <head> <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="submit" value="Würfeln" onclick="Wuerfel_1();" /><br> <!-- Ausgabe auf HTML Seite; ID=meinAusgabefeld--> <font color="#0000FF"><h1 id="meinAusgabefeld"></h1></font> </body> </html>

So könnte es aussehen: JS_Kurs_B04a.html