复制以下内容至文本文件，修改文件后缀txt为html，即可使用。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>随机选择程序</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
background-color: #f0f0f0;
margin: 0;
}
#display {
font-size: 1.5em;
margin: 20px;
padding: 20px;
border: 2px solid #333;
border-radius: 10px;
background-color: #fff;
width: 80%;
text-align: center;
}
.red {
color: red;
}
.blue {
color: blue;
}
button {
font-size: 1.2em;
padding: 10px 20px;
margin: 10px;
border: none;
border-radius: 5px;
background-color: #007bff;
color: white;
cursor: pointer;
}
button:active {
background-color: #0056b3;
}
</style>
</head>
<body>
<div id="display">点击“开始”按钮，随机选择6个红色名单和1个蓝色名单</div>
<button id="startStopBtn">开始</button>
<script>
const redList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33];
const blueList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16];
let intervalId;
let isRunning = false;
// 随机选择函数
function getRandomItems(list, count) {
let shuffled = list.slice(); // 复制数组
for (let i = shuffled.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]]; // 交换元素
}
return shuffled.slice(0, count); // 返回前count个元素
}
// 开始滚动
function startRolling() {
intervalId = setInterval(() => {
const randomRed = getRandomItems(redList, 6);
const randomBlue = getRandomItems(blueList, 1);
document.getElementById('display').innerHTML = `
<span class="red">红色名单：${randomRed.join(', ')}</span><br>
<span class="blue">蓝色名单：${randomBlue.join(', ')}</span>
`;
}, 100);
}
// 停止滚动
function stopRolling() {
clearInterval(intervalId);
}
// 按钮点击事件
document.getElementById('startStopBtn').addEventListener('click', () => {
if (isRunning) {
stopRolling();
document.getElementById('startStopBtn').textContent = '开始';
} else {
startRolling();
document.getElementById('startStopBtn').textContent = '停止';
}
isRunning = !isRunning;
});
</script>
</body>
</html>