Javascript highscore计数器未更新
我正在尝试制作一个游戏来测量你的反应时间，但我的最快分数跟踪器是非常有缺陷的。它在第一次反应测试期间工作，但之后停止工作。提前感谢任何能提供帮助的人Javascript highscore计数器未更新,javascript,html,forms,Javascript,Html,Forms,我正在尝试制作一个游戏来测量你的反应时间，但我的最快分数跟踪器是非常有缺陷的。它在第一次反应测试期间工作，但之后停止工作。提前感谢任何能提供帮助的人 <!DOCTPYE html> <html> <head> <script> window.onload = alert("Press START to start the game. As soon as the screen turns red click the stop button. Ge
<!DOCTPYE html>
<html>
<head>
<script>
window.onload = alert("Press START to start the game. As soon as the screen turns red click the stop button. Get the fastest time you can. Good luck");
var button = document.getElementById("reactionTester");
var start = document.getElementById("start");
var startTime;
var scoreContainer = document.getElementById("p");
var css = document.createElement("style");
css.type= "text/css";
var counter = 0;
var timer = null;
var highscore = document.getElementById("highscore");
var currentRecord = 0;
var highscoreCounter = 0;
function init(){
var startInterval/*in milliseconds*/ = Math.floor(Math.random()*10)*1000;
clearTimeout(timer);
timer = setTimeout(startTimer,1/*startInterval*/);
document.body.appendChild(css);
css.innerHTML = "html{background-color: blue;}";
}
function startTimer(){
startTime = Date.now();
css.innerHTML="null";
css.innerHTML = "html{background-color: red;}";
if(counter==1){
p1 = document.getElementsByTagName('p')[1];
p1.parentNode.removeChild(p1);
counter++;
}
}
function stopTimer(){
if(startTime){
var stopTime = Date.now();
var dif = stopTime - startTime;
alert("Your time is " + dif + " ms");
startTime = null;
css.innerHTML = null;
var p = document.createElement("p");
document.body.appendChild(p);
p.innerHTML = dif;
counter=1;
if (highscoreCounter != 0){
if(dif < currentRecord){
Phighscore2 = document.getElementsByTagName('p')[0];
Phighscore2.parentNode.removeChild(Phighscore2);
document.getElementById("highscore").appendChild(highscoreP);
currentRecord = dif;
highscoreP.innerHTML = currentRecord;
}
else{}
}
else{
var highscoreP = document.createElement("p");
document.getElementById("highscore").appendChild(highscoreP);
currentRecord = dif;
highscoreP.innerHTML = currentRecord;
highscoreCounter++;
}
}
else{
alert("don't trick me");
}
}
</script>
</head>
<body>
<div id="highscore">
</div>
<form id="form">
<div class="tableRow">
<input type="button" value="start" id="start" onclick="init()">
</div>
<div class="tableRow">
<input type="button" id="reactionTester" onclick="stopTimer()" value="stop">
</div>
<div id="p">
</div>
</form>
</body>
</html>
window.onload=alert（“按开始键开始游戏。一旦屏幕变红，单击停止按钮。以最快的速度完成游戏。祝你好运”）；
var按钮=document.getElementById（“reactionTester”）；
var start=document.getElementById（“start”）；
var startTime；
var scoreContainer=document.getElementById（“p”）；
var css=document.createElement（“样式”）；
css.type=“text/css”；
var计数器=0；
var定时器=null；
var highscore=document.getElementById（“highscore”）；
var currentRecord=0；
var highscoreCounter=0；
函数init（）{
var startInterval/*以毫秒为单位*/=Math.floor（Math.random（）*10）*1000；
清除超时（计时器）；
定时器=设置超时（startTimer，1/*startInterval*/）；
document.body.appendChild（css）；
css.innerHTML=“html{背景色：蓝色；}”；
}
函数startTimer（）{
startTime=Date.now（）；
css.innerHTML=“null”；
css.innerHTML=“html{背景色：红色；}”；
如果（计数器==1）{
p1=document.getElementsByTagName（'p'）[1]；
p1.parentNode.removeChild（p1）；
计数器++；
}
}
函数stopTimer（）{
如果（开始时间）{
var stopTime=Date.now（）；
var dif=停止时间-开始时间；
警报（“您的时间为“+dif+”毫秒”）；
startTime=null；
css.innerHTML=null；
var p=document.createElement（“p”）；
文件.正文.附件（p）；
p、 innerHTML=dif；
计数器=1；
如果（highscoreCounter！=0）{
如果（difhighscoreP函数stopTimer- 不要一次又一次地创建相同的DOM元素；它使您的代码复杂化，并加重了浏览器内存管理器的压力。静态定义所有元素，并按ID引用它们，就像您对容器所做的一样（highscore，p）
- 不要动态构建样式元素，这是非常糟糕的做法。相反，静态定义CSS类，然后通过设置属性className动态分配类 即使你在纯JavaScript中编程很好，你也可以考虑使用jQuery。