在HTML select中使用多维数组？

<select id="province" onchange="updateCity()">
  <option value="">请选择省份</option>
</select>
<select id="city" onchange="updateDistrict()">
  <option value="">请选择城市</option>
</select>
<select id="district">
  <option value="">请选择区县</option>
</select>

<script>
  var data = [
    {
      province: '广东省',
      cities: [
        {
          city: '广州市',
          districts: ['天河区', '越秀区', '海珠区']
        },
        {
          city: '深圳市',
          districts: ['福田区', '罗湖区', '南山区']
        }
      ]
    },
    {
      province: '浙江省',
      cities: [
        {
          city: '杭州市',
          districts: ['西湖区', '拱墅区', '下城区']
        },
        {
          city: '宁波市',
          districts: ['海曙区', '江东区', '江北区']
        }
      ]
    }
  ];

  function updateCity() {
    var provinceSelect = document.getElementById('province');
    var citySelect = document.getElementById('city');
    var districtSelect = document.getElementById('district');

    var provinceIndex = provinceSelect.selectedIndex;
    var cityIndex = citySelect.selectedIndex;

    // 清空城市和区县选项
    citySelect.innerHTML = '<option value="">请选择城市</option>';
    districtSelect.innerHTML = '<option value="">请选择区县</option>';

    if (provinceIndex > 0) {
      var cities = data[provinceIndex - 1].cities;
      for (var i = 0; i < cities.length; i++) {
        var option = document.createElement('option');
        option.text = cities[i].city;
        citySelect.add(option);
      }
    }
  }

  function updateDistrict() {
    var provinceSelect = document.getElementById('province');
    var citySelect = document.getElementById('city');
    var districtSelect = document.getElementById('district');

    var provinceIndex = provinceSelect.selectedIndex;
    var cityIndex = citySelect.selectedIndex;

    // 清空区县选项
    districtSelect.innerHTML = '<option value="">请选择区县</option>';

    if (provinceIndex > 0 && cityIndex > 0) {
      var districts = data[provinceIndex - 1].cities[cityIndex - 1].districts;
      for (var i = 0; i < districts.length; i++) {
        var option = document.createElement('option');
        option.text = districts[i];
        districtSelect.add(option);
      }
    }
  }
</script>