If语句在Javascript中不能正常工作

我编写了一个程序，根据用户的年龄输入显示饮料图像或警报窗口。问题在于，无论提交了什么值，它都只执行语句的“if”部分。在执行之前，未检查任何其他条件。我尝试使用getElementById和元素id来代替querySelector，但程序根本没有运行。我尝试了带有按钮标签的querySelector，也尝试了输入标签。这也不起作用

函数strt（）{
让button=document.getElementById（'aButton'）；
按钮。addEventListener（'click'，verifyAge）；
}
函数验证（）{
让惠顾=document.querySelector（'age'）；
让primaryImg=document.getElementById（'mainImg'）；
如果（乘客量<21）{
primaryImg.src='images/cola.jpg'；
}否则，如果（乘客量>=21）{
primaryImg.src='images/tallboy.jpg'；
}否则，如果（光顾而不是写此：

let patronAge = document.querySelector('age');

你应该写以下内容：

let patronAge = parseInt(document.querySelector('#age').value);

你的方法有一些问题

querySelector（'age'）
查找标记为
age
的元素，但该元素不存在。由于您使用的是
querySelector
，因此需要指定
符号来搜索id
您需要访问HTMLElement的值
您需要将该值解析为一个数字
两个小问题。它们很容易发现。请查看代码片段，如果您不理解任何内容，请告诉我


函数strt（）{
让button=document.getElementById（'aButton'）；
按钮。addEventListener（'click'，verifyAge）；
}
函数验证（）{
让pathonage=document.getElementById（'age'）.value；
让primaryImg=document.getElementById（'mainImg'）；
如果（乘客量<21）{
primarymg.src='1〕https://via.placeholder.com/120';
}否则，如果（乘客量>=21）{
primarymg.src='1〕https://via.placeholder.com/150';
}else if（光顾）欢迎使用SO！添加
console.log（光顾）
——它不是一个数字，而是一个DOM元素，可能是空的，因为它是
id=“age”
，
“#age”
。您可能需要
+document.querySelector（'#age'）。value；
（未测试）它访问输入元素的
值
，并将其解析为一个数字。此外，您可能希望
e.preventDefault（）
避免表单提交用户是一个DOM元素……它不会是一个数字。使用console.log（）进行简单调试将显示此信息。此外，
光顾==NaN
将始终为
false
，因为您的代码永远不会到达第二个“else if”，因为任何小于21的值也小于0。谢谢。这真的很有帮助