控制台向我显示以下错误“类型错误无法读取属性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>
答案 0 :(得分:3)
尝试正确更新所有选择器。您在其中一些内容中遗漏了.
/ #
。
var userSubmit = document.querySelector('.guessSubmit');
// ----^----
// add `.` or `#` based on what guessSubmit selector is for