如何将document.getElementById(“ myNumber”)的值存储在变量中并添加if-else语句

时间:2018-09-15 13:14:50

标签: javascript

constant

在此代码中,我想将number的值存储在变量中,以便在if-else语句中可以将该数字的值与10和-10进行比较,并在if-else语句中执行操作。 我还想打印出来,如果数字大于10,它将打印出您的获胜;当数字小于-10时,它将打印出您的损失。

1 个答案:

答案 0 :(得分:1)

您可以在<p id="message"></p>旁边的input元素中,在if-else语句中添加以下语句var xVal=document.getElementById("myNumber").value;if(xVal>=10){ clearInterval (timer); document.getElementById("message").innerHTML="You Win"},以与其他情况。检查以下工作解决方案:

<html>
<head>
<title>question 5</title>
</head>
<body>
<button id="b0" onclick="start()">Start Game</button>
<br>

<img src ="https://images.pexels.com/photos/45910/goldfish-carassius-fish-golden-45910.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"  id ="fish" onclick="mySore()" height="200" width="200">

<script type="text/javascript">

    var image_tracker = 'happy'  ;
    var image = document.getElementById('fish');
    image.style.display = "none";
    function change() {
        if (image_tracker == 'happy'){

                image.src = 'https://images.pexels.com/photos/45910/goldfish-carassius-fish-golden-45910.jpeg?auto=compress&cs=tinysrgb&h=650&w=940';
                image_tracker = 'sad';
            }
            else{
                image.src = 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSCvJNQB6U62UvdD5oinU1hbpUWeUDAniae39-rlP6T7ONJARhQ';
                image_tracker = 'happy';
            }

    }
    var timer;
    function start(){
        image.style.display = "block";
        timer = setInterval ('change();',1600);
    }

    function stop() {
        clearInterval (timer);
    }


function mySore() {
    if( image_tracker == 'sad' ){
     var x =  document.getElementById("myNumber").stepUp();
     var xVal=document.getElementById("myNumber").value;
  
      if ( xVal >= 10){

        clearInterval (timer);
 document.getElementById("message").innerHTML="You Win";
image.style.display = "none";  document.getElementById("myNumber").disabled=true
      }
    }
    else{
     var y = document.getElementById("myNumber").stepDown();
     var yVal=document.getElementById("myNumber").value;
     
     if ( yVal < -10){
 document.getElementById("message").innerHTML="You lost";
 image.style.display = "none";  document.getElementById("myNumber").disabled=true
        clearInterval (timer);
      }
    }
}
</script>

<p><strong>Your Score: <input type="number" id="myNumber"></strong></p>
<p id="message"></p>

</body>
</html>

相关问题