math,去重,排序综合练习【双色球】

效果:红色每次随机出现六个不相同的数字,从小到大排序且在1~31间,蓝色在1~16间

style部分:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            height:100px;
            width:100px;
            background:red;
            color:white;
            border-radius:50%;
            float:left;
            margin-right:20px;
            font-size:50px;
            text-align:center;
            line-height:100px;
        }
        section{
            height:100px;
            width:100px;
            background:deepskyblue;
            color:white;
            border-radius:50%;
            float:left;
            font-size:50px;
            text-align:center;
            line-height:100px;
        }
    </style>
</head>
<body>
js部分:
<script>
    window.onload=function(){
        var aDiv=document.getElementsByTagName("div");
        var section=document.getElementsByTagName("section");

        function distinct(arr){//传入一个随机数组进行去重
            //建立一个空数组用来存值
            var newArr=[];
            //循环遍历数组
            for(var i=0;i<arr.length;i++){
                //当输入进来的数组不存在该值的时候添加该值,否则不添加
                if(newArr.indexOf(arr[i])==-1){
                    //像新数组中添加值
                    newArr.push(arr[i]);
                }
            }
            //返回新数组
            return newArr;
        }
        //num是输出个数,max是最大值
        function random(num,max){
            //建数组arr存用户输入的值  0max
            var arr=[];
            //建数组newarr arr中的随机数
            var newarr=[];
            //循环添加arr数组中的值,0max之间所有值
            for(var i=1;i<max;i++){
                arr.push(i);
            }
            //循环次数是num,就是取多少次随机数添加到newarr            for(var i=0;i<num;i++){
                newarr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
            }
            //跟数组排序
            var rua=newarr.sort(function(x,y){
                return x-y;
            });
            //返回排序后的数组
            return rua;
        }
        //建变量生成随机数5个最大值33
        var num=random(6,33);
        console.log(num);
        //循环div让他的innerHTML值等于数组中的数
        for(var i=0;i<num.length;i++){
            aDiv[i].innerHTML=num[i];
        }
        //生成一个116的数
        var xxx=random(1,16);
        //添加数值到section        for(var i=0;i<xxx.length;i++){
            section[i].innerHTML=xxx[i];
        }
    }
</script>
body部分:
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<section></section>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/xinye666666/article/details/80764474