Javascript 如何避免在创建输入元素之前选择它们？

这是我的JS小提琴：

给我带来麻烦的代码块是：

btn.addEventListener('click', ()=> {
  if (!gamePlay) {
    gamePlay=true
    btn.innerHTML="Check Combo"
    makeGame(6)
  } else { 
    const inputs=Array.from(document.querySelectorAll('input'))
    for (let i=0; i<inputs.length; i++) {
      if (inputs[i].value!==inputs[i].correct) {
        instructions.innerHTML=`Guesses ${++guesses}`
        console.log(inputs[i].value)
        return
      } else {
        instructions.innerHTML=`It took you ${guesses} to win`
      }
    }
  }
})

btn.addEventListener（'click'，（）=>{
如果（！游戏性）{
游戏性=真实
btn.innerHTML=“检查组合”
makeGame（6）
}否则{
const inputs=Array.from（document.querySelectorAll（'input'））
for（设i=0；i
它显然是在用户更改任何元素的值之前选择输入元素

这不是真的，但如果是也没关系。唯一重要的是，当他们被选中时，他们是存在的，他们确实存在

因此，即使用户获得了正确的组合，输入值也都是空的

您正在使用
console.log（输入[i].value）
将值记录到控制台。它们不是空的，对吗

真正的问题是
correct
属性是一个数字：

el.correct=Math.floor(Math.random()*5)+1

以及要将其与之进行比较的
值
属性：

if (inputs[i].value!==inputs[i].correct) {

是字符串。
！=
要求其操作数具有相同的类型。请将值转换为数字以进行比较：

if (Number(inputs[i].value) !== inputs[i].correct) {

您需要在输入字段上设置一个事件侦听器，以了解它们何时更改。游戏规则是什么？目的是什么？您是否希望颜色仅在按下按钮时显示？您应该将设置它们的代码移动到按钮的
单击
侦听器，然后，而不是更新
更改
。