Question

我需要点击“重置分数”按钮进行重置。谁能帮我？我尽了全力，但我不知道该怎么做。

https://github.com/SandroGamrekelashvili/New-folder

const game = () => {
  let pScore = 0;
  let cScore = 0;

 });
const startGame = () => {
const playBtn = document.querySelector(".intro button");
const introScreen = document.querySelector(".intro");
const match = document.querySelector(".match");

Answer 1

在其他问题here中，我很好地解释了解决问题所需的条件。

这个想法是，您将创建一个引用与您的分数相关的函数的变量，而不是在主函数中声明变量，然后可以在需要时调用该变量。为了避免全局冲突，您应该让该函数返回一个对象，该对象的内部带有用于getter和setter的函数。就您而言，我会做这样的事情：

const scoreModule = () => {
  let pScore = 0;
  let cScore = 0;

  return {
    getPScore: () => pScore,
    getCScore: () => cScore,
    setPScore: value => pScore = value,
    setCScore: value => cScore = value,
  }
}

由于您将scoreModule定义为全局对象，因此可以在任何需要的地方使用它。而且，由于只返回了getter和setter（而不是实际值，而是获取或更改它们的手段），因此您的对象受到保护，并且避免了全局可用变量的错误做法。然后，在任何其他函数中，当您想使用它们来获取或设置它们时，只需：

    const game = () => {
      // To get a score
      const currentPScore = scoreModule().getPScore()
      // To set a score
      scoreModule().setPScore(newScore)
});

Answer 2

要完成重置工作，您需要完成几件事。

1。）将重置按钮元素分配给const。

2。）将分数元素移至父范围。

const game = () => {
   let pScore = 0;
   let cScore = 0;

   const resetBtn = gameContainer.querySelector("button.startOver");

   const playerScore = document.querySelector(".player-score p");
   const computerScore = document.querySelector(".computer-score p");
   // The rest of your code...

2。）将事件侦听器附加到重置按钮。

const startGame = () => {

    playBtn.addEventListener("click", () => {
        introScreen.classList.add("fadeOut");
        match.classList.add("fadeIn");
    });

    resetBtn.addEventListener("click", () => {
        playerScore.innerText = '0';
        computerScore.innerText = '0';
        pScore = cScore = 0;
    });
};

Here is a JSFiddle并附有有效示例。

我不能按“重置”按钮

2 个答案: