如何在单击下拉菜单时动态添加输入类型

<select id="dropdown">
  <option value="text">文本输入框</option>
  <option value="number">数字输入框</option>
  <option value="email">邮箱输入框</option>
</select>

<div id="inputContainer"></div>

// 获取下拉菜单和容器的引用
var dropdown = document.getElementById("dropdown");
var inputContainer = document.getElementById("inputContainer");

// 添加事件监听器
dropdown.addEventListener("change", function() {
  // 清空容器中的内容
  inputContainer.innerHTML = "";

  // 获取选中的输入类型
  var selectedType = dropdown.value;

  // 根据选中的输入类型创建相应的输入框
  var inputElement = document.createElement("input");
  inputElement.type = selectedType;

  // 将输入框添加到容器中
  inputContainer.appendChild(inputElement);
});