Question

我刚刚制作了这个小游戏，用户可以点击。他可以看到他的点击次数，就像“cookieclicker”一样。

一切都有效，除了一件事。

我尝试通过编写一行代码来缩短代码，我会重复很多次。

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>

Answer 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"您希望稍后再次更新它。

Javascript游戏

1 个答案: