用JavaScript中lodash编写双色球
<!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>
<style>
header {
width: 500px;
height: 100px;
margin: 0 auto;
background-color: red;
border-radius: 10px;
} header>h1 {
color: orange;
text-align: center;
line-height: 100px;
} li {
list-style: none;
} input {
width: 40px;
height: 30px;
} .change {
width: 500px;
height: 400px;
background-color: burlywood;
margin: 0 auto;
} .change>p:first-child {
text-align: center;
font-size: 24px;
} .change>p:nth-child(2) {
color: red;
} .change>p:nth-child(4) {
color: blue;
} #red {
display: flex;
} #red input {
margin-right: 20px;
} #star {
width: 100px;
height: 50px;
margin-left: 190px;
} .return {
color: red;
font-size: 20px;
text-align: center;
}
</style>
</head> <body> <header>
<h1>中国福利双色球</h1>
</header> <div class="change">
<p>请选择号码</p>
<p>红球(1~33)</p>
<ul id="red">
<li id="red1">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
</li>
</ul>
<p>蓝球(1~16)</p>
<ul id="blue">
<li>
<input type="text" value="" id="playblue">
</li>
</ul>
<p>
<input type="button" value="确定" id="star">
</p>
<p>彩票结果为：</p>
<p class="return"></p>
</div> <script src="./lodash.js"></script>
<script>
window.onload = function () {
let num = [];//创建空数组
while (true) {
num.push(_.random(1, 33));//将随机数添加到num中
num = _.uniq(num)//去重
if (num.length == 6) {
break;
}
}
let num1 = [];//蓝球数
num1.push(_.random(1, 16));
console.log(num, num1)
let star = document.getElementById('star');
let playblue = document.getElementById('playblue');
let end =document.querySelector('.return');
let input = document.querySelectorAll('#red1>input')//得到所有的input
console.log(input)
star.onclick = function () {
//红球
let play = [];
_.forEach(input, function (text) {
let test = text.value-0;//获取输入的值
play.push(test)
})
//蓝球
let play1=[];
play1.push(playblue.value-0);
//判断
//红球判断
restu=_.intersection(num,play);
//蓝球判断
restu1=_.intersection(num1,play1);
if(restu.length==6&&restu1.length==0){
end.innerHTML="恭喜你获得二等奖"
}else if(restu.length==4||(restu.length==3&&restu1.length==1)){
end.innerHTML='恭喜你获得五等奖：10元'
}else if(restu.length==1&&restu1.length==1){
end.innerHTML='恭喜你获得六等奖：5元'
}else if(restu.length==0){
end.innerHTML='未中奖'
}else if(restu.length==6&&restu1.length==1){
end.innerHTML="恭喜你获得一等奖500万"
}else if(restu.length==5&&restu1.length==1){
end.innerHTML="恭喜你获得三等奖3000元"
}
} }
</script>
</body> </html>
用JavaScript中lodash编写双色球的更多相关文章
- 用JavaScript中jQuery编写放大镜效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [技术翻译]在现代JavaScript中编写异步任务
本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...
- javascript中的this与函数讲解
前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...
- 【总结】浅谈JavaScript中的接口
一.什么是接口 接口是面向对象JavaScript程序员的工具箱中最有用的工具之一.在设计模式中提出的可重用的面向对象设计的原则之一就是“针对接口编程而不是实现编程”,即我们所说的面向接口编程,这个概 ...
- JavaScript中的this陷阱的最全收集
JavaScript来自一门健全的语言,所以你可能觉得JavaScript中的this和其他面向对象的语言如java的this一样,是指存储在实例属性中的值.事实并非如此,在JavaScript中,最 ...
- JavaScript中的匿名函数及函数的闭包
1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种: ...
- 【转】JavaScript中的原型和继承
请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans ...
- 浅显易懂的理解JavaScript中的this关键字
在JavaScript中this变量是一个令人难以摸清的关键字,this可谓是非常强大,充分了解this的相关知识有助于我们在编写面向对象的JavaScript程序时能够游刃有余. 1. 一般用处 对 ...
- JavaScript中的this陷阱的最全收集 没有之一
当有人问起你JavaScript有什么特点的时候,你可能立马就想到了单线程.事件驱动.面向对象等一堆词语,但是如果真的让你解释一下这些概 念,可能真解释不清楚.有句话这么说:如果你不能向一个6岁小孩解 ...
随机推荐
- csharp: Microsoft SqlHelper
from: Microsoft Data Access Application Block for .NET https://www.microsoft.com/en-us/download/con ...
- 03.CSS选择器-->交集并集选择器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 什么是首字节时间（TTFB）
第一字节响应时间(TTFB)=从发送请求到WEB服务器的时间+WEB服务器处理请求并生成响应花费的时间+WEB服务器生成响应到浏览器花费的时间测量第一字节响应时间(TTFB)的工具:http://ww ...
- php备注
一.关于OOP 1.PHP目前不支持方法重载
- Java线程唤醒与阻塞
阻塞指的是暂停一个线程的执行以等待某个条件发生(如某资源就绪),学过操作系统的同学对它一 定已经很熟悉了.Java 提供了大量方法来支持阻塞,下面让我们逐一分析. 转载于:http://blog.cs ...
- 星空灯改装成USB供电
简单的手工活,20分钟搞定 1.用一根USB线剪断,将红黑两根线分别连接到星空灯电源供电的正负极 2.由于USB输出5V 0.5A的电流,因此需要改装下,办法一,加电阻,办法二,换灯泡,由于小电阻并不 ...
- ubuntu16 下安装redis 以及设置其为开机启动
1.下载redis安装包 sudo wget http://download.redis.io/releases/redis-3.2.6.tar.gz 2.解压 tar -zxvf redis-3. ...
- 在notepad++中快速插入当前时间方法
插件是notepad++的一大优势,而要实现此功能,也必须借助TextFX插件. 1.点击"插件"-->"Plugin Manager"-->&qu ...
- Docker的一些常用命令
# systemctl start docker //启动docker # systemctl restart docker //重启docker # systemctl enable docker ...
- Python学习---Django下的Sql性能的测试
安装django-debug-tools Python学习---django-debug-tools安装 性能测试: settings.py INSTALLED_APPS = [ ... 'app01 ...