用HTML编写一个代码,要求写一个抽学号回答问题的程序, 逻辑: 第一组:从1~33号中,选取6个,不能够重复。第二组:从1~16号中,选取1个。要求; 单击“抽取学号”,第一组、第二组按从小到大的顺序输出。提示: Math.random()生成[0,1)的随机数。
时间: 2024-11-07 12:13:03 浏览: 51
1_lower7y7_定义一个包含学生信息(学号_成绩)的顺序表和链表(二选一)_姓名_使其具有如下功能_
5星 · 资源好评率100%
为了创建一个简单的HTML页面,结合JavaScript来实现这个抽学号的程序,你可以参考以下代码:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>抽奖程序</title>
<style>
#output {
margin-top: 20px;
}
</style>
</head>
<body>
<h2>抽奖结果</h2>
<button onclick="drawNumbers()">抽取学号</button>
<p id="firstGroup"></p>
<p id="secondGroup"></p>
<script>
function drawNumbers() {
// 定义数组
const firstGroupRange = Array.from({ length: 33 }, (v, i) => i + 1).slice(0, 6);
const secondGroupRange = Array.from({ length: 16 }, (v, i) => i + 1);
// 随机选择并排序
let selectedFirstGroup = shuffle(firstGroupRange).sort((a, b) => a - b);
let selectedSecondGroup = shuffle(secondGroupRange)[0];
// 输出结果
document.getElementById("firstGroup").innerText = `第一组: ${selectedFirstGroup.join(", ")}`;
document.getElementById("secondGroup").innerText = `第二组: ${selectedSecondGroup}`;
// 洗牌函数
function shuffle(array) {
for (let i = array.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
return array;
}
}
</script>
</body>
</html>
```
在这个例子中,我们首先创建了两个范围数组,然后通过`shuffle`函数打乱数组顺序,接着对第一组进行排序。点击按钮后,会触发`drawNumbers`函数,显示随机选择的学号。
阅读全文