無法讀取null屬性，無法處理DOM操作，網頁中的所有元素都設置為null

Question

無法處理DOM操作，獲取調用的錯誤，無法讀取null的屬性“...”

我正在設計一個JS游戲，對於那個游戲，我需要對一些DOM操作進行編碼，但是當我嘗試開發一些游戲功能時，我在控制台窗口中出現錯誤顯示無法讀取屬性'...'的null，並且通過檢查我發現所有元素都設置為null，但id標簽處理得很好，不知道如何解決這個問題。

以下是html代碼

<div class="container">
    <div class="row">
    <div class="column">
        <img src="img/enemy.png" class="img-responsive animate" id="enemy-1">
    </div>
    <div class="column">
        <img src="img/enemy.png" class="img-responsive animate" id="enemy-2">
    </div>
    <div class="column">
        <img src="img/enemy.png" class="img-responsive animate" id="enemy-3">
    </div>
    </div>
</div>

以下部分是Javascript部分

var shootingSound = new Audio('shoot.mp3');
  var bgCanvas = document.getElementById("#enemy-1");
  if(bgCanvas)
  {
  bgCanvas.addEventListener("click", function (){
    //shooty.play();
    shootingSound.play();
  });
  }
  else{
  console.log("Checky");
  }

我想在點擊img時播放拍攝聲音，但是我得到了其他條件，“Checky”會登錄到控制台。

Answer 1

getElementById不使用jQuery使用的哈希符號。 該行應該是：

    var bgCanvas = document.getElementById("enemy-1");

編輯

<audio id="audio">
    <source src="shoot.mp3" type="audio/mpeg" />
</audio>

    document.getElementById("audio").play()