企业网站的推广方式和手段有哪些,小程序多少钱一年,学校网站网站建设,黄山旅游攻略自由行路线推荐一、需求
在时代少年团的七个人中#xff0c;随机抽取一个人获得一等奖#xff0c;再抽取一个获二等奖#xff0c;再抽取一个获三等奖。注意同一个人不能同时获得多个奖项
如下图所示 二、代码素材
以下是缺失JS部分的代码#xff0c;感兴趣的小伙伴可以先自己试着写一写…一、需求
在时代少年团的七个人中随机抽取一个人获得一等奖再抽取一个获二等奖再抽取一个获三等奖。注意同一个人不能同时获得多个奖项
如下图所示 二、代码素材
以下是缺失JS部分的代码感兴趣的小伙伴可以先自己试着写一写
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title年会抽奖/titlestyle.box {margin: 50px auto;width: 1024px;height: 576px;background-image: url(./photo15.jpg);color: white;text-align: center;}.box .duiqi {padding-top: 40px;}.box h2 {font-size: 50px;}.box h3 {font-size: 40px;}.box h4 {font-size: 30px;}/style
/headbodydiv classboxh2 classduiqi年会抽奖/h2h2 classduiqi一等奖spanxxx/span/h2h3 classduiqi二等奖spanxxx/span/h3h4 classduiqi三等奖spanxxx/span/h4/divscriptconst arr [马嘉祺, 丁程鑫, 宋亚轩, 严浩翔, 刘耀文, 贺峻霖, 张真源]/script
/body/html
还有图片素材我也放这了有需要的小伙伴自取哈
注意一定要放图片因为文字颜色是白色的不放图片你应该能想象渲染出的效果是什么样的吧
注意一定要修改代码中的图片路径不修改路径你应该能想象渲染出的效果是什么样的吧 三、算法思路
1、封装随机数函数用于获得一个 N 到 M 之间的随机整数注意左右都是闭区间[N,M]
2、获取相关元素一等奖、二等奖、三等奖的获奖人信息
3、随机抽取时代少年团数组中的元素即人名将抽取到的人名填入一等奖、二等奖、三等奖的获奖人信息。注意抽取一个元素就需要在数组中删除这个元素因为同一个人不能同时获得多个奖项 四、完整代码
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title年会抽奖/titlestyle.box {margin: 50px auto;width: 1024px;height: 576px;background-image: url(./photo15.jpg);color: white;text-align: center;}.box .duiqi {padding-top: 40px;}.box h2 {font-size: 50px;}.box h3 {font-size: 40px;}.box h4 {font-size: 30px;}/style
/headbodydiv classboxh2 classduiqi年会抽奖/h2h2 classduiqi一等奖spanxxx/span/h2h3 classduiqi二等奖spanxxx/span/h3h4 classduiqi三等奖spanxxx/span/h4/divscriptconst arr [马嘉祺, 丁程鑫, 宋亚轩, 严浩翔, 刘耀文, 贺峻霖, 张真源]const price []price[0] document.querySelector(h2 span)price[1] document.querySelector(h3 span)price[2] document.querySelector(h4 span)//函数功能返回 N 到 M 之间的随机整数[N,M]function random(N, M) {return Math.floor(Math.random() * (M - N 1) N)}for (let i 0; i price.length; i) {const rand random(0, 6 - i)price[i].innerHTML arr[rand]arr.splice(rand, 1)}/script
/body/html
