蓝桥杯(Web大学组)2022省赛真题:冬奥大抽奖
思路:
使用模板字符串,借助time的值选择添加或移除样式的盒子,由于盒子的类名最多为li9,所以要将time的值取余,且判断余数为0时,就取1,否则会获取空值报错
`.ul .li${time%9!=0?time%9:1}`
代码:
let rollTime; // 定义定时器变量用来清除定时器
let time = 0; // 转动次数
let speed = 300; // 转动时间间隔
let times; // 总转动次数// 开始按钮点击事件后开始抽奖
$("#start").on("click", function () {$("#award").text(""); //清空中奖信息times = parseInt(Math.random() * (20 - 30 + 1) + 20, 10); // 定义总转动次数,随机20-30次rolling();
});// TODO:请完善此函数
function rolling() {time++; // 转动次数加1//添加黄色样式的类document.querySelector(`.ul .li${time%9!=0?time%9:1}`).classList.add('active');clearTimeout(rollTime);rollTime = setTimeout(() => {//移除类document.querySelector(`.ul .li${time%9!=0?time%9:1}`).classList.remove('active');window.requestAnimationFrame(rolling); // 进行递归动画}, speed);// time > times 转动停止if (time > times) {clearInterval(rollTime);//将结果显示在上面$("#award").text(`${document.querySelector(`.ul .li${time%9!=0?time%9:1}`).innerText}`); //清空中奖信息time = 0;return;}
}
相关文章:
蓝桥杯(Web大学组)2022省赛真题:冬奥大抽奖
思路: 使用模板字符串,借助time的值选择添加或移除样式的盒子,由于盒子的类名最多为li9,所以要将time的值取余,且判断余数为0时,就取1,否则会获取空值报错 .ul .li${time%9!0?time%9:1} 代码…...
单调队列 单调栈
单调队列 一种下标单调,值也单调的队列。 以长度为 k k k 的区间内最大值为例,在一个数进队时,可以知道在他之前的肯定下标比他小,所以如果前面的数比他小,那么前面的数肯定不能成为最大值,直接出队,如果前面的数比他大,因为前面的数下标靠前,所以这个数有可能在以…...
Java基础-泛型
泛型: 泛型,就是允许在定义类、接口时通过一个标识表示类中某个属性的类型或者是某个方法的返回值或参数的类型。这个类型参数将在使用时(例如,继承或实现这个接口、创建对象或调用方法时)确定(即传入实际的…...
Vue 全组件 局部组件
一、组件定义和使用 1、全局组件 定义 <template> <div> <h1>This is a global component</h1> </div> </template> <script lang"ts"> </script> <style></style> 导入 全局组件在main.tsÿ…...
几个经典金融理论
完整EA:Nerve Knife.ex4黄金交易策略_黄金趋势ea-CSDN博客 一、预期效用理论 预期效用理论是描述人们在做出决策时如何考虑风险和不确定性的一种理论。该理论最初由经济学家冯诺伊曼(John von Neumann)和奥斯卡摩根斯坦恩(Oskar…...
c++语言max函数的使用
目录 头文件包含 使用语法 注意事项 头文件包含 首先,在使用std::max函数之前,需要包含头文件 <algorithm>。 #include <algorithm> 使用语法 std::max函数有两种重载形式,一种用于比较两个值,另一种用于比较多…...
c++阶梯之类与对象(下)
前文: c阶梯之类与对象(上)-CSDN博客 c阶梯之类与对象(中)-CSDN博客 c阶梯之类与对象(中)< 续集 >-CSDN博客 1. 再谈构造函数 1.1 构造函数体赋值 在创建对象时&a…...
机器学习--K-近邻算法常见的几种距离算法详解
文章目录 距离度量1 欧式距离(Euclidean Distance)2 曼哈顿距离(Manhattan Distance)3 切比雪夫距离 (Chebyshev Distance)4 闵可夫斯基距离(Minkowski Distance)5 标准化欧氏距离 (Standardized EuclideanDistance)6 余弦距离(Cosine Distance)7 汉明距离(Hamming Distance)【…...
<网络安全>《30 网络信息安全基础(1)常用术语整理》
1 肉鸡 所谓“肉鸡”是一种很形象的比喻,比喻那些可以随意被我们控制的电脑,对方可以是WINDOWS系统,也可以是UNIX/LINUX系统,可以是普通的个人电脑,也可以是大型的服务器,我们可以象操作自己的电脑那样来操…...
Git远程仓库的使用(Gitee)及相关指令
目录 1 远程仓库的创建和配置 1.1 创建远程仓库 1.2 设置SSH公钥 2 指令 2.1 git remote add 远端名称(一般为origin) 仓库路径 2.2 git remote 2.3 git push [-f] [--set-upstream] [远端名称 [本地分支名][:远端分支名]] 2.3 git clone url 2.4 git fetch 2.5 git p…...
vscode +markdown 的安装和使用
文章目录 前言一、vscode markdown 是什么?1.vscode是什么?2.markdown 是什么? 二、安装步骤1.下载2.安装 三、安装插件1.安装 Markdown All in One2.安装 Markdown Preview Enhanced3. Paste Image v1.0.44.LimfxCodeExv0.7.105.Code Spell …...
Python爬虫之自动化测试Selenium#7
爬虫专栏:http://t.csdnimg.cn/WfCSx 前言 在前一章中,我们了解了 Ajax 的分析和抓取方式,这其实也是 JavaScript 动态渲染的页面的一种情形,通过直接分析 Ajax,我们仍然可以借助 requests 或 urllib 来实现数据爬取…...
快速学习Spring
Spring 简介 Spring 是一个开源的轻量级、非侵入式的 JavaEE 框架,它为企业级 Java 应用提供了全面的基础设施支持。Spring 的设计目标是简化企业应用的开发,并解决 Java 开发中常见的复杂性和低效率问题。 Spring常用依赖 <dependencies><!-…...
c语言操作符(上)
目录 编辑 原码、反码、补码 1、正数 2、负数 3、二进制计算1-1 移位操作符 1、<<左移操作符 2、>>右移操作符 位操作符&、|、^、~ 1、&按位与 2、|按位或 3、^按位异或 特点 4、~按位取反 原码、反码、补码 1、正数 原码 反码 补码相同…...
vue3 可视化大屏自适应屏幕组件
首先定义了一个名叫ScreenContainerOptions的组件,需要传的参数如下 export type ScreenContainerOptions {width?: string | numberheight?: string | numberscreenFit?: boolean // 是否开启屏幕自适应,不然会按比例显示 } 组件的主要代码如下 …...
SpringCloud入门概述
1. 介绍 Spring Cloud 1.1 什么是 Spring Cloud Spring Cloud 是一个基于 Spring Boot 的微服务架构开发工具集,它为开发者提供了一系列开箱即用的工具和库,用于构建分布式系统中的微服务架构。Spring Cloud 提供了诸如服务发现、配置中心、负载均衡、…...
刷题计划_冲绿名
现在 rating 是 1104 准备刷 100道 1200的题,把实力提升到 1200 ,上一个绿名 每一个分数段的题都写一百道,争取早日上蓝 现在 虽然 cf 里面显示写了一些这个分数段的题,但是自己训练的时候,其实是没有训练一道这个分…...
【微信小程序开发】小程序版的防抖节流应该怎么写
由于微信小程序与普通网页的开发、编译、运行机制都有所不同,在防抖节流的方法使用上也就需要我们做一些比较棘手的适配操作。常见的H5开发的防抖节流此处就不再分享了,网上有太多的教程,或者直接问那群AI即可。 OK,言归正传&…...
单片机学习笔记---蜂鸣器播放提示音音乐(天空之城)
目录 蜂鸣器播放提示音 蜂鸣器播放音乐(天空之城) 准备工作 主程序 中断函数 上一节讲了蜂鸣器驱动原理和乐理基础知识,这一节开始代码演示! 蜂鸣器播放提示音 先创建工程:蜂鸣器播放提示音 把我们之前模块化的…...
软件实例分享,茶楼收银软件管理系统,支持计时计费商品销售会员管理定时语音提醒功能
软件实例分享,茶楼收银软件管理系统,支持计时计费商品销售会员管理定时语音提醒功能 一、前言 以下软件教程以 佳易王茶社计时计费管理系统软件V18.0为例说明 软件文件下载可以点击最下方官网卡片——软件下载——试用版软件下载 问:这个软…...
设计模式和设计原则回顾
设计模式和设计原则回顾 23种设计模式是设计原则的完美体现,设计原则设计原则是设计模式的理论基石, 设计模式 在经典的设计模式分类中(如《设计模式:可复用面向对象软件的基础》一书中),总共有23种设计模式,分为三大类: 一、创建型模式(5种) 1. 单例模式(Sing…...
【C语言练习】080. 使用C语言实现简单的数据库操作
080. 使用C语言实现简单的数据库操作 080. 使用C语言实现简单的数据库操作使用原生APIODBC接口第三方库ORM框架文件模拟1. 安装SQLite2. 示例代码:使用SQLite创建数据库、表和插入数据3. 编译和运行4. 示例运行输出:5. 注意事项6. 总结080. 使用C语言实现简单的数据库操作 在…...
关于 WASM:1. WASM 基础原理
一、WASM 简介 1.1 WebAssembly 是什么? WebAssembly(WASM) 是一种能在现代浏览器中高效运行的二进制指令格式,它不是传统的编程语言,而是一种 低级字节码格式,可由高级语言(如 C、C、Rust&am…...
IoT/HCIP实验-3/LiteOS操作系统内核实验(任务、内存、信号量、CMSIS..)
文章目录 概述HelloWorld 工程C/C配置编译器主配置Makefile脚本烧录器主配置运行结果程序调用栈 任务管理实验实验结果osal 系统适配层osal_task_create 其他实验实验源码内存管理实验互斥锁实验信号量实验 CMISIS接口实验还是得JlINKCMSIS 简介LiteOS->CMSIS任务间消息交互…...
基于TurtleBot3在Gazebo地图实现机器人远程控制
1. TurtleBot3环境配置 # 下载TurtleBot3核心包 mkdir -p ~/catkin_ws/src cd ~/catkin_ws/src git clone -b noetic-devel https://github.com/ROBOTIS-GIT/turtlebot3.git git clone -b noetic https://github.com/ROBOTIS-GIT/turtlebot3_msgs.git git clone -b noetic-dev…...
C/C++ 中附加包含目录、附加库目录与附加依赖项详解
在 C/C 编程的编译和链接过程中,附加包含目录、附加库目录和附加依赖项是三个至关重要的设置,它们相互配合,确保程序能够正确引用外部资源并顺利构建。虽然在学习过程中,这些概念容易让人混淆,但深入理解它们的作用和联…...
Python+ZeroMQ实战:智能车辆状态监控与模拟模式自动切换
目录 关键点 技术实现1 技术实现2 摘要: 本文将介绍如何利用Python和ZeroMQ消息队列构建一个智能车辆状态监控系统。系统能够根据时间策略自动切换驾驶模式(自动驾驶、人工驾驶、远程驾驶、主动安全),并通过实时消息推送更新车…...
【MATLAB代码】基于最大相关熵准则(MCC)的三维鲁棒卡尔曼滤波算法(MCC-KF),附源代码|订阅专栏后可直接查看
文章所述的代码实现了基于最大相关熵准则(MCC)的三维鲁棒卡尔曼滤波算法(MCC-KF),针对传感器观测数据中存在的脉冲型异常噪声问题,通过非线性加权机制提升滤波器的抗干扰能力。代码通过对比传统KF与MCC-KF在含异常值场景下的表现,验证了后者在状态估计鲁棒性方面的显著优…...
根目录0xa0属性对应的Ntfs!_SCB中的FileObject是什么时候被建立的----NTFS源代码分析--重要
根目录0xa0属性对应的Ntfs!_SCB中的FileObject是什么时候被建立的 第一部分: 0: kd> g Breakpoint 9 hit Ntfs!ReadIndexBuffer: f7173886 55 push ebp 0: kd> kc # 00 Ntfs!ReadIndexBuffer 01 Ntfs!FindFirstIndexEntry 02 Ntfs!NtfsUpda…...
深入浅出Diffusion模型:从原理到实践的全方位教程
I. 引言:生成式AI的黎明 – Diffusion模型是什么? 近年来,生成式人工智能(Generative AI)领域取得了爆炸性的进展,模型能够根据简单的文本提示创作出逼真的图像、连贯的文本,乃至更多令人惊叹的…...
