未捕获的TypeError：answer.appendChild不是函数

Question

这是我的全部代码：

 <div class="conteiner">
    <h3 class="kitxva hide">Question</h3>
 <div class="questionCon " id="questionCon" >

    <button class="anwser1 ">Anwser1</button>
    <button class="anwser1 ">Anwser1</button>
    <button class="anwser1 ">Anwser1</button>
    <button class="anwser1 ">Anwser1</button>

   <div class="controls">
    <button id="start" class="anwser">Start</button>
    <button id="next" class="anwser1">Next</button>
   </div>
 </div>
</div>

const start = document.getElementById('start');
const next = document.getElementById('next');
const questionCon = document.getElementById('questionCon');
const kixtva = document.querySelector('h3')
const anwser = document.querySelectorAll('.anwser1');


let shuffleQuestions, currentQuestionIndex


start.addEventListener('click',startGame);

function startGame(){
  for (var i=0;i<anwser.length;i+=1){
    anwser[i].style.display = 'block';
  }
  kixtva.classList.remove('hide');
  start.classList.add('hide')

  shuffleQuestions = questions.sort(() => Math.random() - .5)
  currentQuestionIndex = 0;
  setNextQuestion()
}

function setNextQuestion(){
   resetState()
   showQuestion(shuffleQuestions[currentQuestionIndex])
}

function resetState(){
   next.classList.add('hide')
   while(anwser.firstChild){
     anwser.removeChild(anwser.firstChild)
   }
}

引用answer.appendChild(button);时出错。

Answer 1

我在您的代码中没有看到answer.appendChild(button);，但我看到answer是document.querySelectorAll('.anwser1')。

问题是querySelectorAll() 返回所有元素作为NodeList对象-不仅是一个元素。您正在寻找querySelector()，它返回与指定的CSS选择器匹配的第一个元素，或者如果您想使用querySelectorAll()获得所有答案，则必须遍历NodeList中的每个元素（可以使用for或forEach或类似名称）。