用js做级联菜单

<select id="country">
  <option value="">Select Country</option>
  <option value="china">China</option>
  <option value="usa">USA</option>
</select>

<select id="province">
  <option value="">Select Province</option>
</select>

const data = {
  china: ['Beijing', 'Shanghai', 'Guangdong'],
  usa: ['California', 'Texas', 'New York']
};

document.getElementById('country').addEventListener('change', function() {
  const country = this.value;
  const provinceSelect = document.getElementById('province');
  provinceSelect.innerHTML = '<option value="">Select Province</option>'; // 清空省份选项

  if (country && data[country]) {
    data[country].forEach(province => {
      const option = document.createElement('option');
      option.value = province;
      option.textContent = province;
      provinceSelect.appendChild(option);
    });
  }
});