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>