.innerHTML 不更新 Javascript 中的 HTML答案

【问题标题】：.innerHTML not updating HTML in Javascript.innerHTML 不更新 Javascript 中的 HTML
【发布时间】：2014-04-23 23:57:54
【问题描述】：

处理石头剪刀布作业，其中全局变量根据计算机或人类获胜而向前递增。我的功能工作正常，但使用 .innerHTML 时记分牌不会更新。有什么建议吗？

document.getElementById("humanScore").innerHTML = humanTotal;
document.getElementById("computerScore").innerHTML = compTotal;

http://codepen.io/anon/pen/GvpaJ

【问题讨论】：

标签： javascript

【解决方案1】：

您遇到了一些问题。

在你的播放函数中，你没有对computerChoice 变量做任何事情，它应该是函数调用compPlay() 的结果。目前是var computerChoice = compPlay，实际上是将computerChoice分配给一个函数，而不是它的结果。

其次在测试if语句中，再次检查compPlay的值，这是一个函数，我认为应该是computerChoice

第三。 compPlay 的返回值是一个索引，它应该是来自compOptions 数组的索引值

以下更新代码

var humanTotal =0;                                          
var compTotal=0;                                    

document.getElementById("rock").onclick = setRock;
document.getElementById("paper").onclick = setPaper;
document.getElementById("scissors").onclick = setScissors;

function setRock(){
    play("rock")
}

function setPaper(){
    play("paper")
}

function setScissors(){
    play("scissors")
}    

function play(humanChoice) {    
    var computerChoice = compPlay(); //<-- Change Here

    //And all the following if statements to check the computer choice
    if (humanChoice == "rock"){
        if (computerChoice  =="rock"){
        } else if (computerChoice =="scissors"){
            humanTotal++; 
        } else if (computerChoice =="paper"){
            compTotal++;
        }
    }

    if (humanChoice == "paper"){
        if (computerChoice  =="paper"){
        } else if (computerChoice =="rock"){
            humanTotal++; 
        } else if (computerChoice =="scissors"){
        compTotal++;
        }
    }

    if (humanChoice == "scissors"){
        if (computerChoice  =="scissors"){
        } else if (computerChoice =="paper"){
            humanTotal++; 
        } else if (computerChoice =="rock"){
            compTotal++;
        }
    }

    document.getElementById("humanScore").innerHTML = humanTotal;
    document.getElementById("computerScore").innerHTML = compTotal;

}   


function compPlay (){
    var compOptions = ['rock', 'paper', 'scissors'];    
    var randomChoice = Math.floor(Math.random()*compOptions.length);
    return compOptions[randomChoice]; //<-- Change Here

}

它与innerHTML无关，它工作正常，只是分数总是为零。原因是因为 computerChoice 从未匹配过“rock”、“paper”或“scissors”，所以没有一个测试“rock”、“paper”或“scissors”的 if 语句解析为真，所以很抱歉，但这是你的功能。

【讨论】：

【解决方案2】：

您的功能无法正常工作。 innerHTML-part 的工作原理应该是这样的（证明：http://codepen.io/anon/pen/qlIsG）。

问题是您在游戏逻辑中犯了一些错误，导致计分板每次都以 0-0 结束。

祝你的任务好运。

【讨论】：

【解决方案3】：

你有几个错误，不是innerHTML的问题：

1) 更改此项，并使用 computerChoice 检查计算机播放

 var computerChoice = compPlay();

2) 在你的 compPlay 函数中，改变这个：

return compOptions[randomChoice]; // you want the play, not the random number

工作版本：

http://codepen.io/juvian/pen/pLqxD

【讨论】：