帮我编写一段HTML的数字随机生成器,分成两组数据一组要求数字选择为1-33,并一次随机6个数字。另外一组为1-16,并一次随机1个数字。title命名为今日双色球,页面美化一下,要求喜庆一些。
<!DOCTYPE html>
<html>
<head>
<title>今日双色球</title>
<meta charset="utf-8">
<style>
body{
background-color: #FBEFFB;
text-align: center;
}
h1{
font-size: 40px;
color: #FF69B4;
margin-top: 50px;
}
p{
font-size: 30px;
color: #8A2BE2;
margin-top: 30px;
}
</style>
</head>
<body>
<h1>今日双色球随机生成器</h1>
<p>红球:
<span id="red1"></span>
<span id="red2"></span>
<span id="red3"></span>
<span id="red4"></span>
<span id="red5"></span>
<span id="red6"></span>
</p>
<p>蓝球:
<span id="blue"></span>
</p>
<pre><code><script>
//生成1-33的随机整数,生成6个红球
var redArray = new Array();
while(redArray.length < 6){
var redNum = Math.floor(Math.random() * 33) + 1;
if(redArray.indexOf(redNum) == -1){
redArray.push(redNum);
}
}
//将红球按照从小到大的顺序排序
redArray.sort(function(a, b){return a-b});
//将6个红球显示在页面上
document.getElementById("red1").innerHTML = redArray[0];
document.getElementById("red2").innerHTML = redArray[1];
document.getElementById("red3").innerHTML = redArray[2];
document.getElementById("red4").innerHTML = redArray[3];
document.getElementById("red5").innerHTML = redArray[4];
document.getElementById("red6").innerHTML = redArray[5];
//生成1-16的随机整数,生成1个蓝球
var blueNum = Math.floor(Math.random() * 16) + 1;
//将蓝球显示在页面上
document.getElementById("blue").innerHTML = blueNum;
</script>
</code></pre>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/zpI 著作权归作者所有。请勿转载和采集!