单击按钮后显示javascript测试

我想在单击按钮（onclick）后显示此测验。此时，它直接出现在网站上。我相信这很简单，但我被困在这里了。你知道我应该如何添加按钮代码吗

以下是HTML：

  <div id="quiz"></div>

下面是JavaScript测试：

(function() {
function buildQuiz() {
  const output = [];

  myQuestions.forEach((currentQuestion, questionNumber) => {
    const answers = [];

    for (letter in currentQuestion.answers) {
      answers.push(
        `<label>
        <input type="radio" name="question${questionNumber}" value="${letter}">
        ${letter} :
        ${currentQuestion.answers[letter]}
      </label>`
      );
    }

    output.push(
      `<div class="question"> ${currentQuestion.question} </div>
    <div class="answers"> ${answers.join("")} </div>`
    );
  });

  quizContainer.innerHTML = output.join("");
}


const quizContainer = document.getElementById("quiz");
const myQuestions = [{
    question: "Who is the strongest?",
    answers: {
      a: "Superman",
      b: "The Terminator",
      c: "Waluigi, obviously"
    },
    correctAnswer: "c"
  },
  {
    question: "What is the best site ever created?",
    answers: {
      a: "SitePoint",
      b: "Simple Steps Code",
      c: "Trick question; they're both the best"
    },
    correctAnswer: "c"
  }
];

（函数（）{
函数buildquick（）{
常量输出=[]；
myQuestions.forEach（（当前问题，问题编号）=>{
常量answers=[]；
for（当前问题中的字母。答案）{
回答，推(
`
${letter}：
${currentQuestion.answers[字母]}
`
);
}
输出推送(
`${currentQuestion.question}
${answers.join（“”}`
);
});
quizContainer.innerHTML=output.join（“”）；
}
const quizContainer=document.getElementById（“测验”）；
常量myQuestions=[{
问题：“谁是最强的？”，
答复:{
答：“超人”，
b:“终结者”，
c:“显然是瓦卢吉”
},
正确答案：“c”
},
{
问题：“有史以来最好的网站是什么？”，
答复:{
a:“站点点”，
b:“简单步骤代码”，
c：“诡计问题；他们都是最好的”
},
正确答案：“c”
}
];

我添加了一个按钮，甚至是单击按钮的侦听器。我认为这很有帮助

（函数（）{
函数buildquick（）{
document.getElementById（“showquick”）.style.visibility=“hidden”
常量输出=[]；
myQuestions.forEach（（当前问题，问题编号）=>{
常量answers=[]；
for（当前问题中的字母。答案）{
回答，推(
`
${letter}：
${currentQuestion.answers[字母]}
`
);
}
输出推送(
`${currentQuestion.question}
${answers.join（“”}`
);
});
quizContainer.innerHTML=output.join（“”）；
}
var quizContainer=document.getElementById（“测验”）；
var myQuestions=[{
问题：“谁是最强的？”，
答复:{
答：“超人”，
b:“终结者”，
c:“显然是瓦卢吉”
},
正确答案：“c”
},
{
问题：“有史以来最好的网站是什么？”，
答复:{
a:“站点点”，
b:“简单步骤代码”，
c：“诡计问题；他们都是最好的”
},
正确答案：“c”
}
];
document.getElementById（'showquick'）。addEventListener（'click'，buildquick）；
}（））；

Show小测验

为了实现自己的目标，你可以做几件事。以下是我认为最好的方法

将buildquick从无名函数调用中去掉，使其成为一阶函数。这将使其他函数能够调用它

创建一个事件侦听器，其中包含加载DOM内容后运行的所有要使用的javascript。如下所示：

document.addEventListener（“DOMContentLoaded”），函数（事件）{
//DOM就绪后要运行的代码
}

这将允许您的代码仅在DOM就绪时运行，并允许您组织代码的运行方式

在前面提到的事件侦听器中，为要控制测验创建的按钮放置一个事件侦听器。在此回调中，将调用创建测验

---

下面是一个例子，说明了这是如何工作的。另外，在您的实际工作中，如果用户的浏览器上没有启用javascript，则必须包含一个noscript标记。干杯！

将onclick事件添加到您的按钮，然后让该按钮执行上面的代码。单击我这不起作用：s