js做石头剪刀布游戏
时间: 2024-09-20 10:09:19 浏览: 19
在JavaScript中制作一个简单的石头、剪刀、布(Rock-Paper-Scissors)游戏,你可以按照以下步骤创建:
1. **创建用户界面**:
- 使用HTML创建一个按钮数组,分别代表石头、剪刀和布,以及一个区域显示计算机的选择。
```html
<button onclick="play('rock')">石头</button>
<button onclick="play('scissors')">剪刀</button>
<button onclick="play('paper')">布</button>
<p id="computer- 编写JavaScript函数`play(userChoice)`,在这个函数中生成计算机的选择(rock、paper或scissors),并显示出来。
```javascript
function play(choice) {
const computerChoices = ['rock', 'paper', 'scissors'];
const randomIndex = Math.floor(Math.random() * computerChoices.length);
const computerChoice = computerChoices[randomIndex];
document.getElementById("computer-choice").innerText = `电脑选择了 ${computerChoice}`;
// 游戏逻辑...
}
```
3. **比较玩家和电脑的选择**:
- 添加一个比较函数来判断胜负,可以利用三者之间的规则(石头砸剪刀,剪刀剪布,布包石头)。
```javascript
function compare(userChoice, computerChoice) {
if (userChoice === computerChoice) return "平局";
if ((userChoice === 'rock' && computerChoice === 'scissors') ||
(userChoice === 'scissors' && computerChoice === 'paper') ||
(userChoice === 'paper' && computerChoice === 'rock')) return "你赢了";
else return "电脑赢了";
}
// 调用compare函数并显示结果
const result = compare(userChoice, computerChoice);
alert(`你选了${userChoice},电脑选了${computerChoice},结果是:${result}`);
```
4. **完整示例**:
- 将上述代码组合在一起,并确保HTML和JavaScript放在同一个文件中,或者将它们分开并在适当的地方引用。
```javascript
// 其他HTML部分...
<script>
document.addEventListener('DOMContentLoaded', function () {
// ...其他功能...
});
</script>
```