根据另一个选择值更改选择内容

<select id="firstSelect" onchange="changeSecondSelect()">
  <option value="option1">选项1</option>
  <option value="option2">选项2</option>
  <option value="option3">选项3</option>
</select>

<select id="secondSelect">
  <option value="subOption1">子选项1</option>
  <option value="subOption2">子选项2</option>
  <option value="subOption3">子选项3</option>
</select>

function changeSecondSelect() {
  var firstSelect = document.getElementById("firstSelect");
  var secondSelect = document.getElementById("secondSelect");

  // 清空第二个选择框的选项
  secondSelect.innerHTML = "";

  // 根据第一个选择框的值，动态添加第二个选择框的选项
  if (firstSelect.value === "option1") {
    var option1 = document.createElement("option");
    option1.value = "subOption1";
    option1.text = "子选项1";
    secondSelect.add(option1);
  } else if (firstSelect.value === "option2") {
    var option2 = document.createElement("option");
    option2.value = "subOption2";
    option2.text = "子选项2";
    secondSelect.add(option2);
  } else if (firstSelect.value === "option3") {
    var option3 = document.createElement("option");
    option3.value = "subOption3";
    option3.text = "子选项3";
    secondSelect.add(option3);
  }
}