<!DOCTYPE html>
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <button class="btn">click me</button> <div class="wrap"></div> <script> var wrap = document.querySelector('.wrap'); var btn = document.querySelector('.btn'); // 需求;点击按钮出现一个七位数的数组,模拟双色球的数据,1-6位是1-33,最后一位1-16 // 封装随机数函数 function rn(a, b) { return Math.round(Math.random() * (b - a) + a); } // 封装产生数组的函数 function show() { // 空数组承接 var arr = []; // 六位数 for (var i = 0; i < 6; i++) { // 随机1-33 var s = rn(1, 33); // 去重 // 如果随机产生的数字在数组中不存在,push if (arr.indexOf(s) == -1) { arr.push(s); } } // 最后一位push进数组 var num = rn(1, 16); arr.push(num); return arr; } // 按钮绑定点击事件,点击时把wrap的内容替换为生成的数组 // += 是防止新产生的数组覆盖旧的 btn.onclick = function () { wrap.innerHTML += show() + '<br>'; } </script> </body> </html>
样式懒得写~~~~毕竟主要是练逻辑