2017-01-31 3 views
1

Я только что сделал эту крошечную игру, где пользователь может нажать. И он видит свои клики, как «cookieclicker».Javascript игра

Все работает, за исключением одной вещи.

Я попытался сократить свой код, сделав переменную строк кода, что я повторяю много раз.

document.getElementById("hp-bar-p").innerHTML = hp; 

Это прекрасно работает, чтобы показать клики, которые пользователь сделал. Но когда я пытаюсь превратить его в переменную, это не сработает. Пример:

var hpdraw = document.getElementById("hp-bar-p").innerHTML = hp; 

Есть причина, почему я не могу сократить текст, сделав его переменной? Или я делаю что-то неправильно?

Весь Javascript ниже:

<style> 
    #clicker { 
     margin: 0 auto; 
     background-color: white; 
     width: 500px; 
     height: 500px; 
    } 
</style> 
<link rel="stylesheet" type="text/css" href="../../style.css"> 

<html> 
    <body> 
     <div id="clicker"> 
      <button id="clickerbutton" onclick="onKlik()"> Click me!</button> 
       <p id="clicktekst"></p><br> 
       <p id="hp-bar-p"></p><br> 
       <p id="kills"></p><br> 
      <button id="upgrade" onclick="upgradeKlik()">upgrade</button> 

     </div> 

    </body> 
</html> 


<script> 
    var mouseclick = 1; 
    var clickcounter = 0; 
    var i = 0; 
    var hp = 10; 
    var kills = 0; 

    var killdraw = document.getElementById("kills").innerHTML = kills; 
    var hpdraw = document.getElementById("hp-bar-p").innerHTML = hp; 
    document.getElementById("clicktest").innerHTML = clickcounter; 
    document.getElementById("hp-bar-p").innerHTML = hp; 




    function onKlik() { 
     clickcounter += mouseclick; 
     hp -= mouseclick; 
     document.getElementById("clicktekst").innerHTML = clickcounter; 
     document.getElementById("hp-bar-p").innerHTML = hp; 

     if (hp<=0) { 
      kills ++; 
      hp = 10; 
      document.getElementById("hp-bar-p").innerHTML = hp; 
      document.getElementById("kills").innerHTML = kills; 
      // hpdraw; 
      // killdraw; 

     } 
    } 

    function upgradeKlik() { 
     while (i == 0 && clickcounter >= 10) { 
      //mouseclick += 1; 
      mouseclick ++; 
      clickcounter -= 10; 
      document.getElementById("clicktekst").innerHTML = clickcounter; 
      break; 
     } 
    } 
</script> 
+0

Совершенно не ясно, что вы пытаетесь сделать. Что бы вы использовали «hpdraw» и так? Единственное место, где они встречаются в вашем коде, - это ссылка, в которой они ничего не делают с ними. –

+0

Вы не используете 'hpDraw' в любом месте. В чем смысл? – BadHorsie

+0

Чтобы сократить код, так что мне не нужно каждый раз использовать document.getElementById. Я ужасно объясняю свои проблемы, и я пытаюсь поправиться! – Hendry

ответ

1

Из вашего комментария отвечая на мой "? Что бы вы использовать hpdraw и такие для" Вопрос:

Чтобы сократить код, так что мне не нужно каждый раз использовать document.getElementById.

Эта линия:

var hpdraw = document.getElementById("hp-bar-p").innerHTML = hp; 

множества hpdraw в результате из document.getElementById("hp-bar-p").innerHTML = hp, что значение hp.

Вы, вероятно, хотите:

var hpdraw = document.getElementById("hp-bar-p"); 
hpdraw.innerHTML = hp 

... а затем hpdraw.innerHTML = "something else", где вы хотите, чтобы обновить его позже.

+0

Спасибо за объяснение! – Hendry

Смежные вопросы