为什么我的石头纸游戏运行不正常

Question

我正在学习前端，这个摇滚纸游戏的项目正在扼杀我，我没有收到任何错误，逻辑对我来说似乎是正确的，但我没有得到任何输出。我觉得我的按钮错了，也许我错了，但我真的不知道，如果有人能帮我，我真的很感激。

<script>
const score=document.querySelector("score");
const buttons=document.querySelectorAll("buttons");
const computer=document.querySelector("computer");
const player=document.querySelector("player");
const rock=document.getElementById("rock");
const paper=document.getElementById("paper");
const scisscors=document.getElementById("scisscors");

function computerplayer(){
let computer=Math.floor(Math.random() * 3);
let random=['rock',"paper",'sisscors']
if(computer>3){
return 'rock'
}
if(computer<2){
return 'paper'
}
else{
return 'sisscors'
}
}
function game(choice,computer){
if(choice=='rock'&& computer=='sisscors'){      
pscore++
score();
console.log( 'u win');
}
if(choice== 'rock'&& computer==="rock"){
console.log("it be a tie")
}
if(choice=="rock"&& computer=="paper"){
cscore++
score();
console.log("u lose");
}
if(choice== 'sisscors'&& computer=='rock'){
console.log( "u lost")
cscore++
score();
}
if(choice=='sisscors'&& computer=='paper'){
console.log('you win')
pscore++
score();
}
if(choice=='paper'&& computer=='rock'){
console.log("you win")
pscore++
score();
}
if(choice=='paper'&& computer=='sisscors'){
console.log("lost")
cscore++
score();
}
}
function score(){
if(pscore==3){
console.log("end game win")
}
if(cscore==3){
console.log("end game loser")
}
}
buttons.addEventListener('click', function(){
game('rock')
})
buttons.addEventListener('click', function(){
game('paper')
})
buttons.addEventListener('click', function(){
game('sisscors')
})

</script>

感谢

Answer 1

首先，此代码不会返回3或更大的

let computer = Math.floor(Math.random() * 3);

那么computerplayer((将只返回"paper"one_answers"sisscors"，您应该更改computerplayer的((函数。

接下来，您应该将按钮事件列表r更改为以下内容：

rock.addEventListener('click', function () {
game('rock', computerplayer())
})
paper.addEventListener('click', function () {
game('paper', computerplayer())
})
rock.addEventListener('click', function () {
game('sisscors', computerplayer())
})

既然你必须更改更多的东西，那么我在这里提到了一个完整的代码：

<script>
window.addEventListener('load', () => {
let pscore = 0;
let cscore = 0;
const result = document.querySelector(".result");
const player = document.querySelector(".pscore");
const computer = document.querySelector(".cscore");
const rock = document.getElementById("rock");
const paper = document.getElementById("paper");
const scissors = document.getElementById("scissors");
rock.addEventListener('click', function () {
game('rock', computerplayer())
})
paper.addEventListener('click', function () {
game('paper', computerplayer())
})
scissors.addEventListener('click', function () {
game('scissors', computerplayer())
})

function computerplayer() {
let random = Math.floor(Math.random() * 3);
if (random == 0)
return 'rock'
else if (random == 1)
return 'paper'
else if (random == 2)
return 'scissors'
}
function game(choice, computerAction) {
if (choice == 'rock' && computerAction == 'scissors') {
pscore++
score();
console.log('u win');
} else if (choice == 'rock' && computerAction === "rock") {
console.log("it be a tie")
} else if (choice == "rock" && computerAction == "paper") {
cscore++
score();
console.log("u lose");
} else if (choice == 'scissors' && computerAction == 'rock') {
console.log("u lost")
cscore++
score();
} else if (choice == 'scissors' && computerAction == 'paper') {
console.log('you win')
pscore++
score();
} else if (choice == 'scissors' && computerAction === "scissors") {
console.log("it be a tie")
} else if (choice == 'paper' && computerAction == 'rock') {
console.log("you win")
pscore++
score();
} else if (choice == 'paper' && computerAction == 'scissors') {
console.log("lost")
cscore++
score();
} else if (choice == 'paper' && computerAction === "paper") {
console.log("it be a tie")
}
function score() {
console.log(pscore, cscore)
player.innerHTML = pscore;
computer.innerHTML = cscore;
if (pscore == 3) {
console.log("end game win")
result.innerHTML = 'You won.';
} else if (cscore == 3) {
console.log("end game loser")
result.innerHTML = 'Computer won.';
}
if (pscore == 3 || cscore == 3) {
rock.style.display = 'none';
paper.style.display = 'none';
scissors.style.display = 'none';
}
}
}
});
</script>

<body>
Computer:<span class="cscore"></span>
<br />
Player: <span class="pscore"></span><br />
<br />
<input type="button" id="rock" value="Rock" />
<input type="button" id="paper" value="Paper" />
<input type="button" id="scissors" value="scissors" />
<span class="result"></span>
</body>