DOMイベントハンドラが動作していないJavascriptオペレータ

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コーディングで私は初心者だということを忘れないでくださいということです： "score"値は別の.jsファイルで定義されています。

Answer 1

あなたはどこにでもスコアを設定しませんでした。 はhttps://jsfiddle.net/Luo87449/

Answer 2

scoreがあり、ここでそれを確認してください。この
var score = document.getElementById("score").innerHTML;

のようにそれを設定するだけ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>