InnerHtml 不起作用的 Javascript 变量

Javascript variable with InnerHtml not working

本文关键字：变量 Javascript 不起作用 InnerHtml 更新时间：2023-09-26

我正在编写一个游戏，当你死的时候，我希望使用innerHTLM根据分数显示文本上的特定游戏，如果/否则如果

我跟着一些嘟嘟，但它似乎不起作用，也不知道为什么。

这是代码：

<div id="game-over">
      <h3><font color="orange">Tu as courus <span id="score"></span> mètres.</font></h3>
      <font color="orange"><h1 id="customegotext">Error text not found</h1></font>
      <a href="javascript:void(0)" class="button restart">Ressayer ?</a>
    </div>
  </div>
  <script>
    var scoretext;
    if ("score" < 45) {
        scoretext = "Text1";
    } else if ("score" > 100 ) {
        scoretext = "Text2";
    } else if ("score" > 500 ) {
        scoretext = "Text3";
    } else if ("score" > 750 ) {
        scoretext = "Text4";
    }
    document.getElementById("customegotext").innerHTML = scoretext;
</script>

更多详情：

变量"score"在索引中指定的单独.js文件中计算.html（存在错误的文件）通过这行代码

<script type="text/javascript" src="ljdm.js"></script>

游戏运行完美（.html，.js和.css通过代码正确关联）
我是编程初学者

谢谢你帮助我！

编辑：这是游戏的完整代码。

索引.html ：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>LE JEU DES MANDARINES</title>
  <link rel="stylesheet" href="ljdm.css" type="text/css" media="screen">
  <script type="text/javascript" src="jquery.2.1.1.min.js"></script>
</head>
<body>
  <div class="wrapper">
    <div class="sound sound-off"></div>
    <div id="menu">
      <div id="progress">
        <div id="percent">Téléchargement: <span id="p"></span></div>
        <progress id="progress-bar" value="0"></progress>
      </div>
      <div id="main">
        <h1>LE JEU DES MANDARINES</h1>
        <ul>
          <li><a href="javascript:void(0)" class="button play">JOUER</a></li>
          <li><a href="javascript:void(0)" class="button credits">Les Credits</a></li>
          <li><a href="javascript:void(0)" class="button howto">Comment Jouer</a></li>
        </ul>
      </div>
      <div id="credits">
        <ul>
        <li class="maincredits">Inspiration Première/Vidéo des Mandarines/Notre Maître a tous : <a href="https://www.youtube.com/user/legrandjd" target="_blank">LeGrandJD</a></li>
        <li class="maincredits">Chef de projet/Idée du Jeu : <a href="https://twitter.com/k0spwn/" target="_blank">k0spwn</a></li>
        <li class="maincredits">Graphiste : <a href="https://twitter.com/seveko00" target="_blank">Seko00</a></li>
        </ul>
        <ul>
          <li class="artwork">Inspiration Première/Vidéo des Mandarines/Notre Maître a tous : <a href="https://www.youtube.com/user/legrandjd" target="_blank">LeGrandJD</a></li>
          <li class="artwork">Character design and art: <a href="https://www.youtube.com/user/legrandjd">LeGrandJD ( Julien Donzé )</a></li>
          <li class="artwork">Animation du personnage : Seko00</li>
          <li class="artwork">Les Plateformes: Seko00</li>
        </ul> 
        <ul>
          <li class="music">La Musique: <a href="https://www.youtube.com/watch?v=aHrc_F8xMXE" target="_blank">LeGrandJD ( Julien Donzé )</a></li>
          <li class="music">Jump sound effect: <a href="http://opengameart.org/content/platformer-jumping-sounds" target="_blank">dklon</a></li>
          <li class="music">Game over music: <a href="https://twitter.com/k0spwn/" target="_blank">k0spwn</a></li>
        </ul>
        <ul>
          <li class="developer">Developeurs : <a href="https://twitter.com/k0spwn/" target="_blank">k0spwn</a> et <a href="https://twitter.com/seveko00" target="_blank">Seko00</a></li>
          <li class="developer">Developeur de la base Javascript/CSS : <a href="http://blog.sklambert.com/" target="_blank">Steven Lambert</a></li>
        </ul>
          <li class="addcredits">Remerciements : <br>- Etienne LAZURE <br>- Jimmy VALECILLOS <br>- Paul ALEXANDROPOULOS <br>- LeGrandJD ( Evidemment ) <br>- La 11VP2 ( Pour nous avoir laissez travaillé en paix)</li>
        <ul>
        </ul>
        <a href="javascript:void(0)" class="button back">Retour au jeu</a>
      </div>
      <div id="howto">
         <ul>
            <h2><font color="blue">Réfere toi a ce magnifique dessin pour apprendre a jouer:</font><h2>
         </ul>   
        <a href="javascript:void(0)" class="button back">Retour au jeu</a>
      </div>
    </div>
    <canvas id="canvas" width="800" height="480">
      <p>Ton naviguateur Internet n'a pas les fonctionnalitée requise pour jouer a ce jeu</p>
      <p>Veuillez télécharger un naviguateur plus récent comme <a href="www.google.com/chrome/‎">Google Chrome</a> pour pouvoir jouer</p>
    </canvas>
    <div id="game-over">
      <h3><font color="orange">Tu as courus <span id="score"></span> mètres.</font></h3>
      <font color="orange"><h1 id="customegotext">Error text not found</h1></font>
      <a href="javascript:void(0)" class="button restart">Ressayer ?</a>
    </div>
  </div>
  <script>
    var scoretext;
    if (score > 0) {
    scoretext = "Text1";
} 
if (score > 45 ) {
    scoretext = "Text2";
}
if (score > 100 ) {
    scoretext = "Text2";
}
if (score > 500 ) {
    scoretext = "Text3";
}
if (score > 750 ) {
    scoretext = "Text4";
}
    document.getElementById("customegotext").innerHTML = scoretext;
</script>
  <script type="text/javascript" src="ljdm.js"></script>
</body>
</html>

在

.js文件中处理乐谱的所有代码：

function gameOver() {
  stop = true;
  $('#score').html(score);
  $('#game-over').show();
  assetLoader.sounds.bg.pause();
  assetLoader.sounds.gameOver.currentTime = 0;
  assetLoader.sounds.gameOver.play();

 // draw the score
    ctx.font = '15pt Calibri';
    ctx.fillStyle = 'red';
    ctx.fillText('Score: ' + score + 'm', canvas.width - 450, 50);

如果"score"是一个变量，你应该使用变量score，而不是一个字符串。

所以，像这样

var scoretext;
if (score < 45) {
    scoretext = "Text1";
} else if (score > 100 ) {
    scoretext = "Text2";
} else if (score > 500 ) {
    scoretext = "Text3";
} else if (score > 750 ) {
    scoretext = "Text4";
}
document.getElementById("customegotext").innerHTML = scoretext;

虽然，问题中不清楚何时执行此代码。如果在游戏结束后使用 ajax/dynamic html 将其添加到页面中，它可能会起作用，否则需要触发代码才能运行。

此外，关于文本的其他内容，您可能需要反转 if 语句或删除 else。

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

变量score写为字符串。你应该不带引号，像这样写：

<script>
    var scoretext;
    if (score < 45) {
        scoretext = "Text1";
    } else if (score > 100 ) {
        scoretext = "Text2";
    } else if (score > 500 ) {
        scoretext = "Text3";
    } else if (score > 750 ) {
        scoretext = "Text4";
    }
    document.getElementById("customegotext").innerHTML = scoretext;
</script>

这： if ("score" < 45) 将字符串与整数进行比较。

将其更改为 if (score < 45)，这将是整数的（int）变量。