HTML用JavaScript生成单抽和十连抽卡的代码
时间: 2024-02-11 16:04:05 浏览: 25
可以使用以下代码来生成单抽和十连抽卡的HTML和JavaScript代码:
单抽卡:
```html
<!DOCTYPE html>
<html>
<head>
<title>单抽卡</title>
</head>
<body>
<button onclick="drawCard()">单抽</button>
<div id="result"></div>
<script>
function drawCard() {
// 生成随机数,用于决定卡牌类型
var randomNum = Math.random();
// 根据随机数决定卡牌类型
var cardType = randomNum < 0.6 ? "普通卡" : "稀有卡";
// 显示卡牌类型
var resultElement = document.getElementById("result");
resultElement.innerHTML = "你抽到了一张" + cardType + "!";
}
</script>
</body>
</html>
```
十连抽卡:
```html
<!DOCTYPE html>
<html>
<head>
<title>十连抽卡</title>
</head>
<body>
<button onclick="drawCards()">十连抽</button>
<div id="result"></div>
<script>
function drawCards() {
// 定义卡牌类型的数组
var cardTypes = ["普通卡", "稀有卡"];
// 定义结果字符串
var resultStr = "";
// 循环抽卡
for (var i = 0; i < 10; i++) {
// 生成随机数,用于决定卡牌类型
var randomNum = Math.random();
// 根据随机数决定卡牌类型
var cardType = cardTypes[randomNum < 0.6 ? 0 : 1];
// 拼接结果字符串
resultStr += "第" + (i + 1) + "张卡:" + cardType + "<br>";
}
// 显示卡牌类型
var resultElement = document.getElementById("result");
resultElement.innerHTML = resultStr;
}
</script>
</body>
</html>
```
这些代码会在页面上生成一个按钮,点击按钮可以进行单抽或十连抽。单抽卡会随机生成一张卡牌,而十连抽会生成十张卡牌,并将结果显示在页面上。