一、需求
在时代少年团的七个人中，随机抽取一个人获得一等奖，再抽取一个获二等奖，再抽取一个获三等奖。注意同一个人不能同时获得多个奖项
如下图所示
二、代码素材
以下是缺失JS部分的代码，感兴趣的小伙伴可以先自己试着写一写
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>年会抽奖</title><style>.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>
</head><body><div class="box"><h2 class="duiqi">年会抽奖</h2><h2 class="duiqi">一等奖：<span>xxx</span></h2><h3 class="duiqi">二等奖：<span>xxx</span></h3><h4 class="duiqi">三等奖：<span>xxx</span></h4></div><script>const arr = ['马嘉祺', '丁程鑫', '宋亚轩', '严浩翔', '刘耀文', '贺峻霖', '张真源']</script>
</body></html>还有图片素材我也放这了，有需要的小伙伴自取哈
注意一定要放图片，因为文字颜色是白色的，不放图片你应该能想象渲染出的效果是什么样的吧
注意一定要修改代码中的图片路径，不修改路径你应该能想象渲染出的效果是什么样的吧
三、算法思路
1、封装随机数函数，用于获得一个 N 到 M 之间的随机整数，注意左右都是闭区间：[N,M]
2、获取相关元素（一等奖、二等奖、三等奖的获奖人信息）
3、随机抽取时代少年团数组中的元素（即人名），将抽取到的人名填入一等奖、二等奖、三等奖的获奖人信息。注意抽取一个元素，就需要在数组中删除这个元素，因为同一个人不能同时获得多个奖项
四、完整代码
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>年会抽奖</title><style>.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>
</head><body><div class="box"><h2 class="duiqi">年会抽奖</h2><h2 class="duiqi">一等奖：<span>xxx</span></h2><h3 class="duiqi">二等奖：<span>xxx</span></h3><h4 class="duiqi">三等奖：<span>xxx</span></h4></div><script>const 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>
