我正在开发一个问答应用程序，有两个主要功能:

1. FetchData

此函数将从API中获取问题并将所有内容显示到网页中。

1. 正确

此函数将检查用户键入的答案是否正确。如果是，则向score变量添加1。但是当第一个函数运行时，它没有向我显示任何东西。我的猜测是选项没有正确显示什么的。下面是我的第一个函数的代码:

async function fetchData() {
  var getData = await fetch(url);
  var toJS = await getData.json();
  answer_container = toJS.results[0].correct_answer;
  var container = [];
  for (var i = 0; i < toJS.results[0].incorrect_answers.length; i++) {
    container.push(toJS.results[0].incorrect_answers[i]);
  }
  container.push(toJS.results[0].correct_answer);
  container.sort(func);

  function func(a, b) {
    return 0.5 - Math.random();
  }
  container.forEach(function(choices) {
    html_container.push(`
<option value=${choices}>
${choices}
</option>
`)
    console.log(choices);
  });
  document.getElementById('choice').add(html_container.join());
  if (toJS.results[0].type === 'boolean') {
    document.getElementById('type').innerHTML =
      `This question is a ${toJS.results[0].category} question <br>
It is a true/false question<br>
Difficulty level: ${toJS.results[0].difficulty} <br>
Question: ${toJS.results[0].question}<br>
`;
  } else {
    document.getElementById('type').innerHTML =
      `This question is a ${toJS.results[0].category} question <br>
It is a ${toJS.results[0].type} choice question <br>
Difficulty level: ${toJS.results[0].difficulty} <br>
Question: ${toJS.results[0].question}<br>
`;
  }
  document.getElementById('answer_element').style.display = "none";
  document.getElementById('answer_element').innerHTML = "The answer to this question is " + toJS.results[0].correct_answer;
}
fetchData();

我在控制台上得到此错误:

未捕获（在承诺中）类型错误：未能对“HtmlSelectElement”执行“Add”：提供的值不属于“（HTMLOptGroupElement或HTMLOptionElement）”类型。

但是我明确地将选项添加到具有选择id的select元素中。

顺晟科技：

问题

我假设是错误，因为它是唯一显示的方法。该错误是由于将字符串()传递给方法，但它是or。要解决此问题，至少有两个选项:和.

解决方案1：使用

在创建选项元素时使用，如下所示: