HTML年會抽獎代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML年會抽獎</title>
<style>
.result { font-size: 30px; color: red; }
</style>
</head>
<body>
<h1>HTML年會抽獎</h1>
<div id="lottery">
<button onclick="drawLottery()">點擊抽獎</button>
<div id="result" class="result"></div>
</div>
<script>
function drawLottery() {
var maxNum = 100; // 最大數(shù)值
var result = Math.ceil(Math.random() * maxNum); // 隨機數(shù)
document.getElementById("result").innerText = "恭喜您獲得了第 " + result + " 號獎品！";
}
</script>
</body>
</html>代碼解釋：
1. <!DOCTYPE html> 用于聲明文檔類型為 HTML5。
2. <meta charset="UTF-8"> 聲明編碼格式為 UTF-8。
3. <title>HTML年會抽獎</title> 設(shè)置網(wǎng)頁標(biāo)題為 “HTML年會抽獎”。
4. <style>...</style> 設(shè)置樣式，result 類的字體大小為 30px，顏色為紅色。
5. <h1>HTML年會抽獎</h1> 設(shè)置網(wǎng)頁標(biāo)題為 “HTML年會抽獎”。
6. <div id="lottery">...</div> 創(chuàng)建一個抽獎的 div，包含一個抽獎按鈕和一個結(jié)果顯示區(qū)域。
7. <button onclick="drawLottery()">...</button> 創(chuàng)建一個點擊事件，當(dāng)點擊抽獎按鈕時，調(diào)用 drawLottery() 函數(shù)。
8. <div id="result" class="result"></div> 創(chuàng)建一個結(jié)果顯示區(qū)域，它有一個 id 為 result，樣式為 result。
9. <script>...</script> 創(chuàng)建一個 JavaScript 腳本，實現(xiàn)抽獎功能。
10. function drawLottery() {...} 是抽獎函數(shù)，使用 Math.random() 函數(shù)生成一個隨機數(shù)并向上取整得到一個范圍在 1 到 maxNum（此處 maxNum 為 100）之間的整數(shù)，然后在結(jié)果顯示區(qū)域顯示獲獎信息。