发布网友 发布时间:2022-04-26 01:59
共2个回答
懂视网 时间:2022-05-15 18:42
这个“大乐透号码生成器”纯前端开发,涉及HTML、JS、CSS。为了简单起见,把所有代码写到了一个html文件中,这样的好处就是可以直接用浏览器打开这个文件,当然实际工作中最好把他们放在不同的文件。整个区域放在一个大的p标签中,表现为一个矩形区域,并通过JS控制显示的位置;设置一个下拉列表,可以选择生成1-5组随机号码,当点击按钮后,就能生成相应组数的号码;号码区域分两部分,上面部分是随机生成的无序的号码,下面部分是对这些无序号码进行排序后的号码,生成组数受上面下拉列表控制。这个工具的核心是生成随机号码和对随机号码进行排序,这两步都是通过JS代码实现的。下面介绍一些重要的JS代码。生成随机号码:大乐透分前区号码和后区号码,前区号码是从01-35中无重复地取5个号码,后区号码是从01-12中无重复地取2个号码,组成一组7位的号码。这里定义了两个数组:arr35存放前区的01-35号码,arr12存放后区的01-12号码。通过“temp = Math.floor(Math.random()*arr35.length)”方法从0-arr35.length取一个随机数作为索引,通过arr35[temp]即可获取数组中该索引位置的值,也就是随机号码,然后通过获取id动态添加到排序前的span中。取完以后通过“arr35.splice(temp,1);”即可删除数组中该随机数,同时使数组长度减一。循环5次即可从01-35中无重复地取5个随机号码,后面两位同样如此。
var arr35 = ["01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17", "18","19","20","21","22","23","24","25","26","27","28","29","30","31","32","33","34","35"]; var arr12 = ["01","02","03","04","05","06","07","08","09","10","11","12"]; var span = ""; var temp = ""; for(var i=1;i<6;i++){ span = "span" + x + i; temp = Math.floor(Math.random()*arr35.length);//随机取一个数 document.getElementById(span).innerText = arr35[temp]; document.getElementById(span).style.backgroundColor = "red"; arr35.splice(temp,1);//删除该位置的值}
随机号码排序:这里用到了插入排序算法,只是对每组号码的前五位进行排序,数据量很小,排序完之后通过获取id动态添加到排序后的span中。
//插入排序 function bubbleSort(array){ var len = array.length; for (var i = 0; i < len; i++) { for (var j = i; j > 0 && array[j]<array[j-1]; j--) { var swap = array[j]; //第二个for循环使元素比较并移动到合适位置 array[j] = array[j-1]; array[j-1] = swap; } } return array; }
其余的JS以及HTML、CSS技术不再详细介绍。
完整代码:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>大乐透号码生成器</title> <style type="text/css"> #table{ width:800px; height:500px; margin:10px; border:2px solid #000000; box-shadow: 10px 10px 5px;border-radius:50px;} .buttonStyle{height:40px;margin:20px;font-size:20px;background-color:#6495ED;color:white;border-radius:10px;} .oneStyle{margin-left:200px;margin-top:10px;font-family:sans-serif;font-size:20px;} span{border-radius: 50%;color: #FFFFFF;padding:3px;font-size:13px;} </style> </head> <body> <p id="table"> <p> <h1 style="text-align:center">大乐透号码生成器</h1> </p> <p class="oneStyle"> 生成组数:<select id="zushu" style="width:150px;height:30px;margin:10px;" onchange="select()"> <option value="1">生成 1 组号码</option> <option value="2">生成 2 组号码</option> <option value="3">生成 3 组号码</option> <option value="4">生成 4 组号码</option> <option value="5">生成 5 组号码</option> </select> </p> <p class="oneStyle"> 随机号码1:<span id="span11"></span> <span id="span12"></span> <span id="span13"></span> <span id="span14"></span> <span id="span15"></span> <span id="span16"></span> <span id="span17"></span><br> 随机号码2:<span id="span21"></span> <span id="span22"></span> <span id="span23"></span> <span id="span24"></span> <span id="span25"></span> <span id="span26"></span> <span id="span27"></span><br> 随机号码3:<span id="span31"></span> <span id="span32"></span> <span id="span33"></span> <span id="span34"></span> <span id="span35"></span> <span id="span36"></span> <span id="span37"></span><br> 随机号码4:<span id="span41"></span> <span id="span42"></span> <span id="span43"></span> <span id="span44"></span> <span id="span45"></span> <span id="span46"></span> <span id="span47"></span><br> 随机号码5:<span id="span51"></span> <span id="span52"></span> <span id="span53"></span> <span id="span54"></span> <span id="span55"></span> <span id="span56"></span> <span id="span57"></span><br> </p> <p class="oneStyle"> 排序后码1:<span id="span61"></span> <span id="span62"></span> <span id="span63"></span> <span id="span64"></span> <span id="span65"></span> <span id="span66"></span> <span id="span67"></span><br> 排序后码2:<span id="span71"></span> <span id="span72"></span> <span id="span73"></span> <span id="span74"></span> <span id="span75"></span> <span id="span76"></span> <span id="span77"></span><br> 排序后码3:<span id="span81"></span> <span id="span82"></span> <span id="span83"></span> <span id="span84"></span> <span id="span85"></span> <span id="span86"></span> <span id="span87"></span><br> 排序后码4:<span id="span91"></span> <span id="span92"></span> <span id="span93"></span> <span id="span94"></span> <span id="span95"></span> <span id="span96"></span> <span id="span97"></span><br> 排序后码5:<span id="span101"></span> <span id="span102"></span> <span id="span103"></span> <span id="span104"></span> <span id="span105"></span> <span id="span106"></span> <span id="span107"></span><br> </p> <p style="text-align:center"> <input class="buttonStyle" id="fiveNumber" type="button" onclick="number()"> </p> </p> <script type="text/javascript"> var table = document.getElementById("table"); var width = document.documentElement.clientWidth; //浏览器可见区域宽 var height = document.documentElement.clientHeight; //浏览器可见区域高 table.style.marginLeft = ((width-800)/2)+"px"; table.style.marginTop = ((height-700)/2)+"px"; var val = "1"; document.getElementById("fiveNumber").setAttribute("title","生成 1 组号码"); document.getElementById("fiveNumber").setAttribute("value","生成 1 组号码"); //随机生成五组号码 function select() { val = document.getElementById("zushu").value; var des = "生成 " + val + " 组号码"; document.getElementById("fiveNumber").setAttribute("title",des); document.getElementById("fiveNumber").setAttribute("value",des); } //随机生成五组号码 function number() { for(var n=1;n<11;n++){ for(var m=1;m<8;m++){ var a = "span" + n + m; document.getElementById(a).innerText = "";//每次点击按钮先清空上一次数据 document.getElementById(a).style.backgroundColor = "white"; } } for(var x=1;x<(parseInt(val)+1);x++){ //从35个号码里面无放回地取5位 var arr35 = ["01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17", "18","19","20","21","22","23","24","25","26","27","28","29","30","31","32","33","34","35"]; //从12个号码里面无放回地取2位 var arr12 = ["01","02","03","04","05","06","07","08","09","10","11","12"]; var span = ""; var temp = ""; for(var i=1;i<6;i++){ span = "span" + x + i; temp = Math.floor(Math.random()*arr35.length);//随机取一个数 document.getElementById(span).innerText = arr35[temp]; document.getElementById(span).style.backgroundColor = "red"; arr35.splice(temp,1);//删除该位置的值 } for(var j=6;j<8;j++){ span = "span" + x + j; temp = Math.floor(Math.random()*arr12.length);//随机取一个数 document.getElementById(span).innerText = arr12[temp]; document.getElementById(span).style.backgroundColor = "blue"; arr12.splice(temp,1);//删除该位置的值 } } for(var x=1;x<(parseInt(val)+1);x++){ var span = ""; //前五位排序 var arr = new Array(5); for(var y=0;y<5;y++){ span = "span" + x + (y+1); arr[y] = document.getElementById(span).lastChild.nodeValue; } var a = bubbleSort(arr); for(var l=0;l<5;l++){ span = "span" + (x+5) + (l+1); document.getElementById(span).innerText = a[l]; document.getElementById(span).style.backgroundColor = "red"; } //后两位排序 var spann6 = "span" + x + "6"; var spann7 = "span" + x + "7"; var spanm6 = "span" + (x+5) + "6"; var spanm7 = "span" + (x+5) + "7"; var span6 = document.getElementById(spann6).lastChild.nodeValue; var span7 = document.getElementById(spann7).lastChild.nodeValue; if(parseInt(span6) > parseInt(span7)){ document.getElementById(spanm6).innerText = span7; document.getElementById(spanm7).innerText = span6; }else{ document.getElementById(spanm6).innerText = span6; document.getElementById(spanm7).innerText = span7; } document.getElementById(spanm6).style.backgroundColor = "blue"; document.getElementById(spanm7).style.backgroundColor = "blue"; } } //插入排序 function bubbleSort(array){ var len = array.length; for (var i = 0; i < len; i++) { for (var j = i; j > 0 && array[j]<array[j-1]; j--) { var swap = array[j]; //第二个for循环使元素比较并移动到合适位置 array[j] = array[j-1]; array[j-1] = swap; } } return array; } </script></body></html>
浏览器打开效果:
热心网友 时间:2022-05-15 16:07
付费内容限时免费查看回答您好,您的问题我已接收,正在整理答案,打字需要时间哦,请您稍作等待,我马上回复您~提问好的
回答您好,很高兴为您解答。亲~为你查询到大乐透选号技巧,巧用这3种方法,中奖率更高 观看视频:
https://v.qq.com/x/page/y050072qxqg_0.html
1、伴侣号码法 :伴侣号码就是连在一起的号。比如07和08,15和16等等,俩个伴侣码出现的概率是80%左右,偶尔还出现三连码、四连码。如果准确的判断出伴侣码出现时机,那么中奖的概率将会大大提高,因此需要注意10、11,30、31等。
2、排除法:把1~35个号码出现的频率排列出来,排除再次出现的号码。如果一个号码在前几期中多次出现,高达4次以上,那么下一期再出现的概率就很小,应在排除之列。而一个号码长期没有出现,冷寂下去,同样也可以排除掉,如目前的21这个号码。
3、重复码法 :重复码就是这期出来了,下期又再出现的号码,甚至连续几期还有它。,如07001期的24;07002期的22、31、35都是重复出现的号码,把握住了这些重复号码,就是把握住了1/7的号码甚至3/7的号码,离大奖就不远了。
请问您还有其他问题吗?很高兴继续为您解答~
希望以上回答对您有所帮助~ 如果您对我的回答满意的话,麻烦给个赞哦~