动态生成问卷选项列表：使用 JavaScript 遍历任意长度的选项数组

在构建网页问卷时，若每个问题的选项数量不固定（例如有的题有 2 个选项，有的有 5 个），继续沿用 first/second/third/fourth 这类解构赋值方式不仅冗余，还会导致扩展性差、易出错。正确做法是将选项视为一个数组，并通过循环动态生成 html 列表项。

以下是推荐的实现方式（已修正原答案中的逻辑错误）：

// ✅ 正确示例：遍历 questions[count].options（而非 .question！） const options = questions[count].options; // 假设 options 是字符串数组，如 ['是', '否'] 或 ['A', 'B', 'C', 'D', 'E'] let html = `
Q${count + 1}. ${questions[count].question}
 
`;  for (let option of options) {   html += `
${escapeHtml(option)}
`; }  html += '
'; question.innerHTML = html;

⚠️ 注意：原答案中误写为 questions[count].question（应为 .options），这是常见笔误，请务必核对数据结构。典型问卷数据格式如下：

const questions = [   {     question: "您是否满意当前服务？",     options: ["非常满意", "满意", "一般", "不满意"]   },   {     question: "请选择您的年龄段",     options: ["18岁以下", "18–25岁", "26–35岁", "36–45岁", "46岁以上"]   } ];

? 安全提示：为防止 xss 攻击，建议对用户输入的选项内容做 HTML 转义（如使用 escapeHtml() 函数）：

立即学习“Java免费学习笔记（深入）”；

function escapeHtml(unsafe) {   return unsafe     .replace(/&/g, "&")     .replace(//g, "youjiankuohaophpcn")     .replace(/"/g, """)     .replace(/'/g, "'"); }

✅ 优势总结：

• ✅ 完全适配任意长度的 options 数组；
• ✅ 无需修改模板代码即可增减选项；
• ✅ 易于与事件委托结合，统一处理选项点击逻辑；
• ✅ 语义清晰，符合现代 javaScript 编程习惯。

从此，你的问卷系统真正具备了“一题多态”的灵活性——无论选项是 2 个还是 20 个，HTML 都能自动生成、安全可靠。