js实现的猜拳小游戏

最近在学js,实现了一个猜拳小游戏,分享一下

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>index</title> 
</head>
<body>
<h3>猜拳游戏</h3> 
    <script >
        // 定义游戏规则
        a='✊',b='✌️',c='?';
        document.write('0:✊ 1:✌️ 2:?<br>')
        var player,computer;
        computer=parseInt((Math.random()*10))%3;
        player=parseInt(window.prompt('出拳吧小子(0:✊ 1:✌️ 2:?):'));
        if(player==0||player==1||player==2){

            switch (player){
                case 0: player=a;break;
                case 1: player=b;break;
                case 2: player=c;break;
                default: player=-99;
            };

            switch (computer){
                case 0: computer=a;break;
                case 1: computer=b;break;
                case 2: computer=c;break;
                default: computer=-99;
            }

            document.write('您出的',player,', 对方出的',computer);
            if(player==computer){
                document.write(', 平局了哦')
            }else if(
                (player==a&&computer==b)||
                (player==b&&computer==c)||
                (player==c&&computer==a)
            ){
                document.write(', 呦呵厉害,你赢啦ψ(`∇´)ψ')
            }else{
                document.write(', 你输了呦╥﹏╥...')
            }
        }else{
            document.write('拜托,请输入正确的数字好么,无比嫌弃...')
        }
    </script>
</body>
</html>

 

  • 4
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
好的,我们可以通过以下步骤来实现一个简单的猜拳游戏: 1. 创建一个 HTML 文件,并在其中添加三个按钮,分别代表石头、剪刀和布。 ```html <!DOCTYPE html> <html> <head> <title>猜拳游戏</title> </head> <body> <h1>猜拳游戏</h1> <button id="rock">石头</button> <button id="scissors">剪刀</button> <button id="paper">布</button> <p id="result"></p> <script src="game.js"></script> </body> </html> ``` 2. 创建一个名为 game.js 的 JavaScript 文件,并在其中添加代码逻辑。 ```javascript // 定义变量 const options = ["rock", "scissors", "paper"]; const resultEl = document.querySelector("#result"); // 生成随机数 function randomChoice() { return options[Math.floor(Math.random() * options.length)]; } // 对战逻辑 function play(playerChoice) { const computerChoice = randomChoice(); // 判断胜负关系 if (playerChoice === computerChoice) { resultEl.textContent = "平局"; } else if ( (playerChoice === "rock" && computerChoice === "scissors") || (playerChoice === "scissors" && computerChoice === "paper") || (playerChoice === "paper" && computerChoice === "rock") ) { resultEl.textContent = "你赢了!"; } else { resultEl.textContent = "你输了~"; } } // 点击事件监听器 document.querySelector("#rock").addEventListener("click", function() { play("rock"); }); document.querySelector("#scissors").addEventListener("click", function() { play("scissors"); }); document.querySelector("#paper").addEventListener("click", function() { play("paper"); }); ``` 3. 浏览器打开 HTML 文件,点击石头、剪刀和布按钮开始游戏游戏结果会显示在页面上方的 p 元素中。 这样就完成了一个基础的猜拳游戏实现

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值