• 一个方法用js生成随机双色球、大乐透

     代码如下：

    1. <!DOCTYPE html>
    2. <html lang="en">
    3.  
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Document</title>
    8.     <style>
    9.         #crateNum {
    10.             display: flex;
    11.             justify-content: center;
    12.         }
    13.  
    14.         #ssqStyle,
    15.         #dltStyle {
    16.             border: 1px solid #ccc;
    17.             padding: 10px;
    18.             background: rgba(0, 0, 0, .5);
    19.         }
    20.  
    21.         #ssqStyle>p,
    22.         #dltStyle>p {
    23.             font-size: 30px;
    24.             text-align: center;
    25.             font-weight: bold;
    26.         }
    27.         #ssqLIst,#dltList{
    28.             height: 300px;
    29.             padding: 50px;
    30.             box-sizing: border-box;
    31.             text-align: center;
    32.             color: #fff;
    33.         }
    34.     </style>
    35. </head>
    36.  
    37. <body>
    38.     <div id="crateNum">
    39.         <div id="ssqStyle">
    40.             <p>双色球</p>
    41.             <button onclick="creatNum('ssq',1)">随机生成1组</button>
    42.             <button onclick="creatNum('ssq',5)">随机生成5组</button>
    43.             <button onclick="creatNum('ssq',10)">随机生成10组</button>
    44.             <hr>
    45.             <ul id="ssqLIst">
    46.             </ul>
    47.         </div>
    48.         <div id="dltStyle">
    49.             <p>大乐透</p>
    50.             <button onclick="creatNum('dlt',1)">随机生成1组</button>
    51.             <button onclick="creatNum('dlt',5)">随机生成5组</button>
    52.             <button onclick="creatNum('dlt',10)">随机生成10组</button>
    53.             <hr>
    54.             <ul id="dltList">
    55.             </ul>
    56.         </div>
    57.     </div>
    58. </body>
    59. <script>
    60.     //定义红篮球数组
    61.     let ssqArr = [], dltArr = [];
    62.  
    63.     //参数说明
    64.     // classify：要产生双色球数据还是大乐透数据，因为用的一个方法，所以要区分一下
    65.     //          ssq：双色球；
    66.     //          dlt：大乐透
    67.     // num：产生多少组
    68.     function creatNum(classify, num) {
    69.         // 定义前后区个数
    70.         let qq = 0, //前区个数--红球数量
    71.             hq = 0, //后区个数--篮球数量
    72.             qqScope = 0, //前区每个球的数值范围---双色球是1-33，大乐透是1-35
    73.             hqScope = 0; //后区每个球的数值范围---双色球是1-16，大乐透是1-12
    74.         // 判断时ssq还是dlt
    75.         if (classify == 'ssq') {
    76.             this.ssqArr = []; //将双色球数据列表清空（避免多次点击数据叠加）
    77.             qq = 6; //双色球的前区（红球）个数为6个
    78.             hq = 1; //双色球的后区（蓝球）个数为1个
    79.             qqScope = 33; //双色球前区(红球)数值范围是1-33
    80.             hqScope = 16; //双色球后区(蓝球)数值范围是1-16
    81.         } else if (classify == 'dlt') {
    82.             this.dltArr = []//将大乐透数据列表清空（避免多次点击数据叠加）
    83.             qq = 5; //大乐透的前区（红球）个数为5个
    84.             hq = 2; //大乐透的后区（蓝球）个数为2个
    85.             qqScope = 35; //大乐透前区(红球)数值范围是1-35
    86.             hqScope = 12; //大乐透后区(蓝球)数值范围是1-12
    87.         }
    88.  
    89.         // 外层循环表示需要产生多少组随机数字
    90.         for (let i = 0; i < num; i++) {
    91.             //定义前后区(红蓝球)数组
    92.             let redBall = [];
    93.             let blueBall = [];
    94.             let blueBallNum = '';
    95.             //获取一组前区(红球)数据
    96.             for (let j = 0; j < qq; j++) {
    97.                 let redBallNum = this.random(1, qqScope);
    98.                 //位数补齐--0-9不足两位的在前面补“0”
    99.                 redBallNum = redBallNum.toString().padStart(2, "0");
    100.                 //判重添加
    101.                 //如果不存在（false），就添加
    102.                 if (redBall.indexOf(redBallNum) == -1) {
    103.                     redBall.push(redBallNum);
    104.                 } else {
    105.                     //反之j--重新循环
    106.                     j--;
    107.                 }
    108.             }
    109.             //前区数字从大到小排序
    110.             redBall.sort((a, b) => {
    111.                 return a - b
    112.             })
    113.             //获取一组后区(蓝球)数据
    114.             for (let k = 0; k < hq; k++) {
    115.                 let blueBallNum = this.random(1, hqScope);
    116.                 //位数补齐--0-9不足两位的在前面补“0”
    117.                 blueBallNum = blueBallNum.toString().padStart(2, "0");
    118.                 //判重添加
    119.                 //如果不存在（false），就添加
    120.                 if (blueBall.indexOf(blueBallNum) == -1) {
    121.                     blueBall.push(blueBallNum);
    122.                 } else {
    123.                     //反之k--重新循环
    124.                     k--;
    125.                 }
    126.             }
    127.             //后区数字从大到小排序
    128.             blueBall.sort((a, b) => {
    129.                 return a - b
    130.             })
    131.             if (classify == 'ssq') {
    132.                 //合并添加到ssqArr(双色球数据列表)中
    133.                 this.ssqArr[i] = (redBall.toString() + "-----" + blueBall.toString());
    134.             } else if (classify == 'dlt') {
    135.                 //合并添加到dltArr(大乐透数据列表)中
    136.                 this.dltArr[i] = (redBall.toString() + "-----" + blueBall.toString());
    137.             }
    138.         }
    139.  
    140.         //操作标签部分
    141.  
    142.         // 获取ul标签,方便后面往里填数据
    143.         let ssqLIst = document.querySelector('#ssqLIst')
    144.         let dltList = document.querySelector('#dltList')
    145.  
    146.         // 判断选的随机产生双色球数据还是大乐透数据
    147.         if (classify == 'ssq') {
    148.             // 清空原先的内容
    149.             ssqLIst.innerHTML = ''
    150.             //将数据循环添加到dom中
    151.             for (let s = 0; s < this.ssqArr.length; s++) {
    152.                 var li = document.createElement("li");
    153.                 li.innerText = this.ssqArr[s];
    154.                 ssqLIst.appendChild(li);
    155.             }
    156.         } else if (classify == 'dlt') {
    157.             // 清空原先的内容
    158.             dltList.innerHTML = ''
    159.             for (let d = 0; d < this.dltArr.length; d++) {
    160.                 var li = document.createElement("li");
    161.                 li.innerText = this.dltArr[d];
    162.                 dltList.appendChild(li);
    163.             }
    164.         }
    165.  
    166.     }
    167.     //获取随机数
    168.     function random(min, max) {
    169.         //Math.random()获取0-1中的随机数
    170.         //随机数需要取整parseInt()，向下取整 Math.floor()
    171.         return parseInt(Math.random() * (max - min) + min);
    172.     }
    173. </script>
    174.  
    175. </html>

    效果如下：

    没咋写过原生，可能里面的方法有待优化。

  • 相关阅读:
    《湖科大教书匠计算机网络》学习笔记总目录+思维导图
    dotnet平台Http消息处理者工厂
    Python 对 split函数的理解
    腾讯位置服务
    invalid use of incomplete type ‘class Ui::xxx‘
    什么是关系选择器
    LeetCode_动态规划_中等_97.交错字符串
    李宏毅机器学习笔记（2016年的课程）：Support Vector Machine (SVM)
    【ubuntu-nginx安装】
    论文学习——FALL-E：GAUDIO FOLEY SYNTHESIS SYSTEM
  • 原文地址：https://blog.csdn.net/qq_45811413/article/details/132818442