怎样通过js脚本制作简易问卷调查_js问卷功能脚本编写与实现

<form id="surveyForm">
  <h2>简易问卷调查</h2>

  <div>
    <p><strong>1. 您的年龄？</strong></p>
    <input type="radio" name="age" value="18以下" required> 18以下<br>
    <input type="radio" name="age" value="18-30"> 18-30<br>
    <input type="radio" name="age" value="31-50"> 31-50<br>
    <input type="radio" name="age" value="50以上"> 50以上
  </div>

  <div>
    <p><strong>2. 您对本站的满意度如何？</strong></p>
    <select name="satisfaction" required>
      <option value="">请选择</option>
      <option value="非常满意">非常满意</option>
      <option value="满意">满意</option>
      <option value="一般">一般</option>
      <option value="不满意">不满意</option>
    </select>
  </div>

  <div>
    <p><strong>3. 您的建议？</strong></p>
    <textarea name="feedback" placeholder="请输入您的意见..."></textarea>
  </div>

  <button type="submit">提交问卷</button>
</form>

<div id="result"></div>

document.getElementById("surveyForm").addEventListener("submit", function(e) {
  e.preventDefault(); // 阻止页面刷新

  const resultDiv = document.getElementById("result");
  const formData = new FormData(this);

  let output = "<h3>提交成功！您的回答：</h3><ul>";
  
  for (let [key, value] of formData.entries()) {
    if (value) {
      output += `<li><strong>${key}：</strong>${value}</li>`;
    }
  }
  output += "</ul>";

  resultDiv.innerHTML = output;
});

function createSurvey() {
  const container = document.body;
  const form = document.createElement("form");
  form.innerHTML = `
    <p><strong>您喜欢JS吗？</strong></p>
    <input type="radio" name="like" value="是" required> 是
    <input type="radio" name="like" value="否"> 否
    <button type="submit">提交</button>
  `;

  form.addEventListener("submit", function(e) {
    e.preventDefault();
    alert("感谢参与！您选择了：" + new FormData(form).get("like"));
  });

  container.appendChild(form);
}

createSurvey(); // 调用函数生成问卷