html+js实现级联选择器

要实现级联选择器，可以使用HTML和JavaScript。以下是一个简单的示例，演示了如何使用HTML和JavaScript创建级联选择器：

HTML代码：

<label for="country">选择国家:</label>
<select id="country" onchange="updateStates()">
  <option value="">请选择</option>
  <option value="china">中国</option>
  <option value="usa">美国</option>
  <option value="uk">英国</option>
</select>
<br>
<label for="state">选择州/省:</label>
<select id="state">
  <option value="">请选择</option>
</select>

JavaScript代码：

const states = {
  china: ["北京", "上海", "广东"],
  usa: ["纽约", "加利福尼亚", "德克萨斯"],
  uk: ["伦敦", "曼彻斯特", "利物浦"]
};

function updateStates() {
  const countrySelect = document.getElementById("country");
  const stateSelect = document.getElementById("state");

  // 清空州/省下拉列表
  stateSelect.innerHTML = '<option value="">请选择</option>';

  // 获取所选国家的州/省列表
  const selectedCountry = countrySelect.value;
  const selectedStates = states[selectedCountry];

  // 如果州/省列表存在，创建下拉列表选项
  if (selectedStates) {
    for (let i = 0; i < selectedStates.length; i++) {
      const option = document.createElement("option");
      option.text = selectedStates[i];
      option.value = selectedStates[i];
      stateSelect.appendChild(option);
    }
  }
}

该代码会创建两个下拉列表框，第一个下拉列表框用于选择国家，第二个下拉列表框用于选择该国家的州/省。当用户选择国家时，使用JavaScript更新州/省下拉列表框的选项。