web蓝桥杯2022省赛真题:冬奥大抽奖

代码及注释:

// TODO:请完善此函数
function rolling() {
  time++; // 转动次数加1
  let roll = time % 8 == 0 ? 8 : time % 8   //循环取1~8
  roll == 1 ? document.querySelector(`.li8`).classList.remove('active') : document.querySelector(`.li${roll-1}`).classList.remove('active') //取消掉前一个元素的active类名
  document.querySelector(`.li${roll}`).classList.add('active')  //当前元素添加的active类名
  clearTimeout(rollTime);
  rollTime = setTimeout(() => {
    window.requestAnimationFrame(rolling); // 进行递归动画
  }, speed);
  // time > times 转动停止
  if (time > times) {
    clearInterval(rollTime);
    time = 0;
    document.querySelector('#award').innerHTML = document.querySelector(`.li${roll}`).innerHTML    // 把当前元素内容放入
    return;
  }
}

知识点:

1.一个周期的循环数值:对周期取余

2.添加类名:element.classList.add('类名')

3.删除类名:element.classList.remove('类名')

4.获取元素document.querySelector('')

相关推荐

  1. Web大学组)2022冬奥抽奖

    2024-03-23 10:28:02       50 阅读
  2. web2022冬奥抽奖

    2024-03-23 10:28:02       46 阅读
  3. Web大学组)2022:展开你的扇子

    2024-03-23 10:28:02       53 阅读
  4. web2022:水果拼盘

    2024-03-23 10:28:02       42 阅读
  5. Web大学组)2023:视频弹幕

    2024-03-23 10:28:02       57 阅读
  6. C/C++A组历年题解(2020~2023

    2024-03-23 10:28:02       34 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-03-23 10:28:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-03-23 10:28:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-03-23 10:28:02       82 阅读
  4. Python语言-面向对象

    2024-03-23 10:28:02       91 阅读

热门阅读

  1. golang kafka sarama 源码解析

    2024-03-23 10:28:02       42 阅读
  2. 一些常用的用法

    2024-03-23 10:28:02       42 阅读
  3. IOS面试题编程机制 1-5

    2024-03-23 10:28:02       34 阅读
  4. 矩阵A的LU分解

    2024-03-23 10:28:02       47 阅读
  5. 深入理解 C#和Unity中的Null

    2024-03-23 10:28:02       40 阅读
  6. 20240322 大模型快讯

    2024-03-23 10:28:02       42 阅读
  7. 微信小程序网络请求封装API集中管理

    2024-03-23 10:28:02       41 阅读
  8. 蓝桥杯day8刷题日记--双子数,有奖问答

    2024-03-23 10:28:02       43 阅读
  9. MySQL-记

    MySQL-记

    2024-03-23 10:28:02      33 阅读