如何将原始输入放入动态下拉列表

<select id="dynamicDropdown"></select>

<script>
  // 获取原始输入数据
  var rawData = ["选项1", "选项2", "选项3"];

  // 获取下拉列表元素
  var dropdown = document.getElementById("dynamicDropdown");

  // 动态生成下拉列表选项
  rawData.forEach(function(option) {
    var newOption = document.createElement("option");
    newOption.text = option;
    dropdown.add(newOption);
  });
</script>

<input type="text" id="userInput">
<select id="dynamicDropdown"></select>

<script>
  // 获取原始输入数据
  var rawData = ["选项1", "选项2", "选项3"];

  // 获取输入框和下拉列表元素
  var userInput = document.getElementById("userInput");
  var dropdown = document.getElementById("dynamicDropdown");

  // 监听输入框变化事件
  userInput.addEventListener("input", function() {
    // 清空下拉列表
    dropdown.innerHTML = "";

    // 根据用户输入过滤原始输入数据
    var filteredData = rawData.filter(function(option) {
      return option.includes(userInput.value);
    });

    // 动态生成下拉列表选项
    filteredData.forEach(function(option) {
      var newOption = document.createElement("option");
      newOption.text = option;
      dropdown.add(newOption);
    });
  });
</script>