存储高分 JavaScript答案

【问题标题】：Storing High Scores JavaScript存储高分 JavaScript
【发布时间】：2020-05-15 12:15:13
【问题描述】：

<html>

    <body> <pre>    
    <script language ='JavaScript'>

document.write(" \n Welcome to the type what you see game the objective of the game is to simply answer what you see on screen by typing into the prompt box, you will press on the answer button next \n to the pictures and type and answer. Once you have moved down the page and had a go at all 5 questions, your result will be displayed once you press the result button. A correct \n answer will be worth 1 pointn an incorrect answer will be worth 0 points, best of luck!")

var r = 0;

function checkAnswer() {

    a = prompt('What animal is in the image?');
    if (a == 'dog') {
        alert('Well Done. Correct answer');
        r++;
    } else {
        alert('Sorry, incorrect, it is a dog');
    }

}

function checkAnswer2() {
    b = prompt('What animal is in the image?');
    if (b == 'hamster') {
        alert('Well Done. Correct answer');
        r++;
    } else {
        alert('Sorry, incorrect, it is a hamster');
    }
}

function checkAnswer3() {
    c = prompt('What animal is in the image?');
    if (c == 'hedgehog') {
        alert('Well Done. Correct answer');
        r++;
    } else {
        alert('Sorry, incorrect, it is a hedgehog');

    }

}

function checkAnswer4() {
    d = prompt('What animal is in the image?');
    if (d == 'turtle') {
        alert('Well Done. Correct answer');
        r++;
    } else {
        alert('Sorry, incorrect, it is a turtle');
    }
}

function checkAnswer5() {
    e = prompt('What animal is in the image?');
    if (e == 'hare') {
        alert('Well Done. Correct answer');
        r++;
    } else {
        alert('Sorry, incorrect, it is a hare');
    }
}

function showResult() {
    alert('the number of questions you answered correct was ' + r + ' 
    questions');

}

    </script>

    </pre>

        <p>Question 1. What is this an image of?</p>
        <img src="http://static1.squarespace.com/static/532abed3e4b025f227941d11/t/532ce5e3e4b0f59c2979d8c2/1395451365611/" class="image1">
        <button onclick="checkAnswer()">Answer</button>
        <p>Question 2. What is this an image of?</p>
        <img src="http://www.hamsters.co.uk/hamsters_images/syrian-hamster_000008437184.jpg" class="image2">
        <button onclick="checkAnswer2()">Answer</button>
        <p>Question 3. What is this an image of?</p>
        <img src="http://www.hellohedgehog.com/wp-content/uploads/2013/08/Hedgehog-7.jpg" class="image3">
        <button onclick="checkAnswer3()">Answer</button>
        <p>Question 4. What is this an image of?</p>
        <img src="http://s.hswstatic.com/gif/turtle-shell-1.jpg" class="image4">
        <button onclick="checkAnswer4()">Answer</button>
        <p>Question 5. What is this an image of?</p>
        <img src="http://static.guim.co.uk/sys-images/Education/Pix/pictures/2011/5/19/1305816821363/The-Irish-hare-is-under-t-007.jpg" class="image5">
        <button onclick="checkAnswer5()">Answer</button>
        <button onclick="showResult()">Result</button>
    </body>

</html>

由于我是 javascript 新手，存储高分最简单的方法是什么，当您单击结果时我会显示一个分数，但存储用户分数会很好吗？

【问题讨论】：

您需要某种服务器端存储。文本文件或数据库。
如果您想将其存储在本地，您可以使用 cookie 或 HTML5 客户端存储。如果要将其存储在服务器上，则需要编写一个服务器端应用程序，将其存储在服务器、数据库或其他存储方法中。
非常感谢你会试一试

标签： javascript jquery html image

【解决方案1】：

Cookies

最简单的方法是使用 cookie。

对于您的示例，您可能可以执行以下操作：

document.cookie = "highscore=" + r;

您可以在以下位置阅读有关 document.cookie 的更多信息： the mozilla mdn page for document.cookie

【讨论】：

【解决方案2】：

你可以使用 localStorage 来存储一些东西

if( typeof(Storage) !== undefined) {
  if(localStorage.high) {
    if(localStorage.high < r) {
      localStorage.high = r;
    }
  } else {
    localStorage.high = 0;
  }
}
//this script changes the localStorage
if(r > localStorage.high) {
  localStorage.high = r;
}

你也可以清除localStorage

localStorage.clear()

【讨论】：