为什么我的文字不会更新？ （HTML + JS）

Question

我正在尝试在我的网站上更新文字。 JS中的变量确实如此，但屏幕上的文字并没有。 （是的，我知道代码是草率的，我让它工作，然后通过并使其漂亮。）

    <script>
    var moneyTotal = 370; //Variable for money, filled with starter money
    var moneyText = String(moneyTotal); //Variable for text
    var OD2Clicked = 0;
</script>
    <script>document.write("<h1 class='money'>Total: $"+ moneyText + "</h1>"); //Line for updating site </script>

<script>
    function Check(){ //Function that checks for radio button change
        if (document.getElementById('OD2').checked & OD2Clicked==0) {
            OD2Clicked = 1;
            Adding(20);
            console.log("Adding");
        }else if(document.getElementById('OD').checked & OD2Clicked>0){
            OD2Clicked = 0;
            Adding(-20);
            console.log("Subtracting");
        }

        setTimeout(function() {Check()}, 5000);
    }


    function Adding(m1){ //Function for adding
        moneyTotal += m1;
        moneyText = String(moneyTotal);
        console.log(moneyTotal);
        console.log(moneyText+" Text");
    }
</script>

Answer 1

就像我在评论中提到的那样：

  

当浏览器解析所有标签时，您的屏幕写入只会发生一次。每次修改值时，都需要在屏幕上更新文本。

这对你有用吗？

<script>
    var moneyTotal = 370; //Variable for money, filled with starter money
    var OD2Clicked = false;

    var timeoutPeriod = 5000;
</script>
    <script>document.write("<h1 class='money'>Total: $0</h1>"); //Line for updating site </script>

<script>
    function Check(){ //Function that checks for radio button change
        if (document.getElementById('OD2').checked) {
            if (!OD2Clicked) {
                OD2Clicked = true;
                moneyTotal += 20;
                console.log('Adding');
            } else if (OD2Clicked) {
                OD2Clicked = false;
                moneyTotal -= 20;
                console.log('Subtracting');
            }

            // Find DOM element we need to update
            document
                .querySelectorAll('.money')[0]
                .textContent = 'Total: $' + moneyTotal;
        }

        setTimeout(Check, timeoutPeriod);
    }
</script>