如何用HTML和JavaScript编写一个网页程序,实现用户点击按钮后会随机显示数字1或2?
时间: 2024-10-22 13:15:32 浏览: 25
为了创建一个简单的HTML和JavaScript网页程序,让用户点击按钮后随机显示数字1或2,你可以按照以下步骤操作:
1. **HTML结构**:
首先,你需要在HTML中创建一个按钮元素和一个用于显示结果的div。
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>随机数字示例</title>
</head>
<body>
<button onclick="showRandomNumber()">点击获取随机数</button>
<div id="result"></div>
<script src="script.js"></script>
</body>
</html>
```
2. **JavaScript代码**:
在`script.js`文件中,添加一个函数`showRandomNumber()`,当用户点击按钮时,这个函数会被调用并生成随机数。
```javascript
// script.js
function showRandomNumber() {
var randomNumber = Math.random() < 0.5 ? 1 : 2; // 生成0到1之间的随机小数,如果小于0.5则显示1,否则显示2
document.getElementById("result").innerText = randomNumber; // 将结果显示在id为"result"的div上
}
```
现在当你打开这个HTML页面,点击“点击获取随机数”按钮,就会看到随机显示的1或2。
阅读全文