Ecco l’esercizio che potremo svolgere su JavaScript: data la funzione Math.Random, creare una pagina che stampa da una funzione i numeri casuali da 1 a 4: 10 100 1000 numeri casuali; creare una funzione che conti quante le frequenze dei numeri generati.
codice:
<!DOCTYPE html>
<html>
<head>
<h1 title align=”center” id=”titolo”>NUMERI CASUALI</title>
<style type=”text/css”>
h1 {color: #0000e6;}
body{
background-color: #99ff66;
}
#titolo{
font-size: 60px;
}
#pulsante1{
border: none;
background: #ff3385;
color: #FFFFF0;
margin: 20px;
padding: 30px;
font-size: 20px;
width: 20%;
}
#pulsante2{
border: none;
background: #ff3385;
color: #FFFFF0;
margin: 20px;
padding: 30px;
font-size: 20px;
width: 20%;
}
#pulsante3{
border: none;
background: #ff3385;
color: #FFFFF0;
margin: 20px;
padding: 30px;
font-size: 20px;
width: 20%;
}
#pulsante4{
border: none;
background: #ff8000;
color: #FFFFF0;
padding: 20px;
font-size: 20px;
width: 100%;
}
#demo{
font-size: 20px;
}
#demo2{
font-size: 20px;
}
</style>
</head>
<body>
<script>
var text=” “;
function Genera(x) {
text=””;
var l=0;
var i;
var n;
for (i = 0; i < x; i++) {
n=Math.floor(Math.random() * 4)+1;
if(l<50){
text +=n+” “;
l++;
}else{
text +=”<br>”+n+” “;
l=1;
}
}
document.getElementById(“demo”).innerHTML = text;
}
function Conta() {
var ripu=0;
var ripd=0;
var ript=0;
var ripq=0;
var s;
var f=text.length;
for(s=0; s<(f-1);s++){
switch(text.slice(s, s+1)){
case “1”:
ripu++;
case “2”:
ripd++;
case “3”:
ript++;
case “4”:
ripq++;
}
}
var b;
var text2=” “;
text2 += “Numero 1 = “+(ripu)+” volte.<br>”;
text2 += “Numero 2 = “+(ripd-ripu)+” volte.<br>”;
text2 += “Numero 3 = “+(ript-ripd)+” volte.<br>”;
text2 += “Numero 4 = “+(ripq-ript)+” volte.<br>”;
document.getElementById(“demo2″).innerHTML = text2;
}
</script>
<h1 align=”center”-color= #0a0a0a -style=”font-size:125%;”>numeri casuali da 1 a 4</h1>
<html>
<head>
<h1 title align=”center” id=”titolo”>NUMERI CASUALI</title>
<style type=”text/css”>
h1 {color: #0000e6;}
body{
background-color: #99ff66;
}
#titolo{
font-size: 60px;
}
#pulsante1{
border: none;
background: #ff3385;
color: #FFFFF0;
margin: 20px;
padding: 30px;
font-size: 20px;
width: 20%;
}
#pulsante2{
border: none;
background: #ff3385;
color: #FFFFF0;
margin: 20px;
padding: 30px;
font-size: 20px;
width: 20%;
}
#pulsante3{
border: none;
background: #ff3385;
color: #FFFFF0;
margin: 20px;
padding: 30px;
font-size: 20px;
width: 20%;
}
#pulsante4{
border: none;
background: #ff8000;
color: #FFFFF0;
padding: 20px;
font-size: 20px;
width: 100%;
}
#demo{
font-size: 20px;
}
#demo2{
font-size: 20px;
}
</style>
</head>
<body>
<script>
var text=” “;
function Genera(x) {
text=””;
var l=0;
var i;
var n;
for (i = 0; i < x; i++) {
n=Math.floor(Math.random() * 4)+1;
if(l<50){
text +=n+” “;
l++;
}else{
text +=”<br>”+n+” “;
l=1;
}
}
document.getElementById(“demo”).innerHTML = text;
}
function Conta() {
var ripu=0;
var ripd=0;
var ript=0;
var ripq=0;
var s;
var f=text.length;
for(s=0; s<(f-1);s++){
switch(text.slice(s, s+1)){
case “1”:
ripu++;
case “2”:
ripd++;
case “3”:
ript++;
case “4”:
ripq++;
}
}
var b;
var text2=” “;
text2 += “Numero 1 = “+(ripu)+” volte.<br>”;
text2 += “Numero 2 = “+(ripd-ripu)+” volte.<br>”;
text2 += “Numero 3 = “+(ript-ripd)+” volte.<br>”;
text2 += “Numero 4 = “+(ripq-ript)+” volte.<br>”;
document.getElementById(“demo2″).innerHTML = text2;
}
</script>
<h1 align=”center”-color= #0a0a0a -style=”font-size:125%;”>numeri casuali da 1 a 4</h1>
<button type=”button” onclick=Genera(10) id=”pulsante1″>10 numeri</button>
<button type=”button” onclick=Genera(100) id=”pulsante2″>100 numeri</button>
<button type=”button” onclick=Genera(1000) id=”pulsante3″>1000 numeri</button>
<p align=”center”, id=”demo”></p>
<button type=”button” onclick=Conta() id=”pulsante4″>Statistiche</button>
<p align=”center”, id=”demo2″></p>
<button type=”button” onclick=Genera(100) id=”pulsante2″>100 numeri</button>
<button type=”button” onclick=Genera(1000) id=”pulsante3″>1000 numeri</button>
<p align=”center”, id=”demo”></p>
<button type=”button” onclick=Conta() id=”pulsante4″>Statistiche</button>
<p align=”center”, id=”demo2″></p>
