如何实现JavaScript测验题答案的分行展示？

当前你代码里生成的答案<label>标签默认是行内元素，全部拼接后会在同一行展示，下面两种方案都不会影响原有代码的其他逻辑：

方案1：最小改动JS（快速生效） #

只需要修改生成答案选项的代码，在每个label末尾添加换行标签<br>即可。
找到你代码里的这一段：

answers.push(
  '<label>' +
  '<input type="radio" name="question' + i + '" value="' + letter + '">' +
  letter + ': ' +
  questions[i].answers[letter] +
  '</label>'
);

修改为：

answers.push(
  '<label>' +
  '<input type="radio" name="question' + i + '" value="' + letter + '">' +
  letter + ': ' +
  questions[i].answers[letter] +
  '</label><br>'
);

方案2：CSS实现（更规范，后续维护方便） #

不需要修改现有JS代码，在你HTML文件的<style>标签里添加以下样式即可：

/* 让每个答案选项单独占一行 */
.answers label {
  display: block;
  margin: 5px 0; /* 可选，给答案加上下间距，排版更美观 */
}

这种写法将样式和业务逻辑分离，后续如果要调整答案的缩进、字号、间距，都不需要改动JS代码，更符合前端开发的规范。

内容的提问来源于stack exchange，提问作者Sarah Rosenberg