TypeError : NULL의 속성 'addEventListener'를 읽을 수 없습니다

Question

콘솔에 다음 오류가 표시됩니다. "유형 오류가 null의 속성 addeventlistner를 읽을 수 없습니다."내 스크립트가 페이지 끝 부분에 있습니다. 클릭하면 null 값을 지우는 방법 여기에서 찾을 수 있습니다. 솔루션을 찾을 수있는 대부분의 오류가 머리에 스크립트를 배치하지만 내가 시작부터 바닥에 배치했습니다.이 문제를 배우고 해결하는 데 도움이!

 <div class="form"> 
     <label for="guessField">Enter a guess: </label> 
     <input type="text" id="guessField" class="guessField"> 
     <input type="submit" value="Submit guess" class="guessSubmit"> 
    </div> 

    <p class="guesses"></p> 
    <p class="lastResult"></p> 
    <p class="lowOrHi"></p> 
<script> 

    var random = Math.floor(Math.random() * 100) + 1; 

    var userguess = document.querySelector('.guessField'); 

    var userSubmit = document.querySelector('guessSubmit'); 

    var guesses = document.querySelector('guesses'); 

    var lastResult = document.querySelector('lastResult'); 

    var lowOrHi = document.querySelector('lowOrHi'); 

    var guesscount = 1; 

    var resetbutton; 

    function checkGuess() { 

     var userinput = Number(userguess.value); 

     if (guesscount === 1) { 
      guesses.textContent = 'previous guesses:'; 
     } 
     else { 
      guesses.textContent = 'previous guesses' + userinput; 
     } 

     if (userinput === random) { 

      lastResult.textContent = "awesome bruh you got it right"; 
      lastResult.style.backgroundColor = 'green'; 
      gameOver(); 
     } 

     else if (guesscount === 10) { 
      lastResult.textContent = "oops you have run out of try"; 
      gameOver(); 
     } 

     else { 
      lastResult.textContent = "wrong value"; 
      lastResult.style.backgroundColor = 'red'; 
     } 

     if (userinput < random) { 
      lowOrHi.textContent = "it was too low"; 
     } 

     else if (userinput > random) { 
      lowOrHi.textContent = "it was too high"; 
     } 

     guesscount++; 
    } 

    userSubmit.addEventListener('click', checkGuess); 

</script> 

Answer 1

모든 선택기를 올바르게 업데이트하십시오. 그들 중 일부에 ./#이 누락되었습니다.

var userSubmit = document.querySelector('.guessSubmit'); 
//         ----^---- 
// add `.` or `#` based on what guessSubmit selector is for