“ document.getElementById”不起作用

Question

我正在使用HTML和JavaScript編程一組交通信號燈，但遇到了問題。 我創建了一個按鈕，該按鈕應將網站上的文本行更改為數字，但是無論何時單擊它都不會執行任何操作。 我認為這是document.getElementById腳本存在的問題，因為我認為可能沒有其他問題。 這是我的代碼：

<p id="dummy">PLACEHOLDER</p>

<script>
var imgArray = ["img0", "img1", "img2", "img3"];

imgArray[0] = new Image(300, 150);
imgArray[0].src = "Assets/TrafficLightRedLight.jpg";
imgArray[1] = new Image(300, 150);
imgArray[1].src = "Assets/TrafficLightRedAmberLight.jpg";
imgArray[2] = new Image(300, 150);
imgArray[2].src = "Assets/TrafficLightAmberLight.jpg";
imgArray[3] = new Image(300, 150);
imgArray[3].src = "Assets/TrafficLightGreenLight.jpg";

var counter = 0;

function count(counter){
    if (counter =! 3){
         counter + 1;
    }   
    else{
        counter = 0;
    }
    document.getElementById("dummy").innerHTML = counter;
}

</script>

<button type="button"
onclick="count">Test_Function</button>

Answer 1

四個問題：

1. 您需要在處理程序中調用 count ：

    <button type="button" onclick="count()">Test_Function</button> 

2. counter =! 3 counter =! 3應該是counter != 3 ，否則將其設置為false

3. counter + 1不會執行任何操作。 使用counter += 1或counter++
4. 不要將counter用作參數-您只修改本地副本。

以上所有修復：

 <p id="dummy">PLACEHOLDER</p> <script> var imgArray = ["img0", "img1", "img2", "img3"]; var counter = 0; imgArray[0] = new Image(300, 150); imgArray[0].src = "Assets/TrafficLightRedLight.jpg"; imgArray[1] = new Image(300, 150); imgArray[1].src = "Assets/TrafficLightRedAmberLight.jpg"; imgArray[2] = new Image(300, 150); imgArray[2].src = "Assets/TrafficLightAmberLight.jpg"; imgArray[3] = new Image(300, 150); imgArray[3].src = "Assets/TrafficLightGreenLight.jpg"; function count() { if (counter != 3) { counter++; } else { counter = 0; } document.getElementById("dummy").innerHTML = counter; } </script> <button type="button" onclick="count()">Test_Function</button>