Question

我正在编写游戏代码，当游戏结束时，我想成为根据分数显示的特定文字。

这是我编码的内容：

    <div id="game-over">
      <h3><font color="orange">Tu as courus <span id="score"></span> mètres, tu peux faire mieux (ou pas)</font></h3>
      <h1 id="customegotext" onmouseover="mouseOver()" onmouseout="mouseOut()">Passe ta souris içi</h1>
      <a href="javascript:void(0)" class="button restart">Réessayer ?</a>
    </div>
  </div>
  <script>
      var scoretext;
    document.getElementById("score")
    if (score < 45) {
        scoretext = "Text1";
    } else if (score > 100 ) {
        scoretext = "Text2";
    } else if (score > 500 ) {
        scoretext = "Text3";
    } else if (score > 750 ) {
        scoretext = "Text4";
    } else {
        scoretext = "Text5";
    }
    document.getElementById("customegotext").innerHTML = scoretext;
function mouseOver() {
    document.getElementById("customegotext").style.color = "orange";
}

function mouseOut() {
    document.getElementById("customegotext").style.color = "black";
}
</script>

问题是它总是显示“text5”

感谢您的帮助，请记住我是编码的初学者

PS：“得分”值在单独的.js文件中定义。

Answer 1

你没有在任何地方设置分数。像这样设置var score = document.getElementById("score").innerHTML;

在此处查看https://jsfiddle.net/Luo87449/

Answer 2

score只是一个 DOM对象（因为默认情况下id是一个全局属性），这里需要它的值进行比较。

score = document.getElementById("score").innerHTML

现在它将具有您可以与其他Numbers进行比较的值。

此外，当span内有值时，您需要执行此调用。

您在上面发布的代码只是在span为空时在页面加载上进行此比较。

Answer 3

用以下代码替换您的脚本代码：

<script>
    var scoretext;

    score = document.getElementById("score");

    if (score < 45) {
        scoretext = "Text1";
    } else if (score > 100 ) {
        scoretext = "Text2";
    } else if (score > 500 ) {
        scoretext = "Text3";
    } else if (score > 750 ) {
        scoretext = "Text4";
    } else {
        scoretext = "Text5";
    }

    document.getElementById("customegotext").innerHTML = scoretext;

    function mouseOver() {
        document.getElementById("customegotext").style.color = "orange";
    }

    function mouseOut() {
        document.getElementById("customegotext").style.color = "black";
    }
</script>

Javascript运算符与DOM事件处理程序无法正常工作

3 个答案: