首页 > 其他分享> 文章详细

WebApi Day01 随笔

2022-07-17 18:34:36 阅读：194 来源： 互联网

标签：WebApi Day01 innerHTML 倒计时获奖 names 按钮随笔 Math

1. 抽奖案例

功能：

页面：一等奖：二等奖：三等奖：

每次刷新都有对应的姓名获奖而且不能重复获奖

原生 javascript 实现：

1. 声明一个数组names存放名字

2. 定义parseInt(Math.random() * names.length) 获取随机数组下标

3. 首先渲染一等奖获取对象 .innerHTML = names[随机下标]

4. 删除这个元素防止重复获奖 splice(randomNum，1)

5. 重复 3 - 4 步骤

注：【随机】蛮重要的

  // 取 N - M 的随机整数
      function getRandom(N, M) {
        return Math.floor(Math.random() * M - N + 1) + N
      }

2. 倒计时

功能：

阅读协议时的倒计时：倒计时期间不能点击按钮倒计时结束按钮的innerHTML 改变 “我已经阅读用户协议” ==》同意按钮也从disabled 禁用变为可使用（点击）

原生js：

1. 刷新后就要开始倒计时用间隔函数 setInterval(fn，1000) i = 60 从60s开始计时

2. 回调函数里i-- 用模板字符串接收i的值赋值给innerHTML

3. 如果i === 0 关闭计时器clearIntervaldisabled = false innerHTML = ’同意‘

3. 轮播图

功能：自动播放

标签：WebApi,Day01,innerHTML,倒计时,获奖,names,按钮,随笔,Math
来源： https://www.cnblogs.com/zhulongxu/p/16487994.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9