js实现全国省市区三级联动

实现三级联动的主要代码已贴，另外的data数据可自己网上查找
HTML实现代码 ：

省：<select id="provice">
			<option>--请选择--</option>
		</select>
		市：<select id="city">
			<option>--请选择--</option>
		</select>
		区：<select id="area">
			<option>--请选择--</option>
		</select>

js的实现代码：

var provice = document.getElementById("provice");
var citys = document.getElementById("city");
var areas = document.getElementById('area');
var cities;//定义一个变量存放市
var newarea; //定义一个变量存放区
var data = city[0];
	for(var i in data){
		var options = new Option(data[i].name,i);//实例化，data[i].name为省名，value为值
		provice.appendChild(options); //动态添加
		console.log(data[i].name,i)
	}	
	provice.onchange = function () {
		citys.options.length = 1;//城市选择的长度变为1个
		var provices = this.value;//将当前省份的值提取出来
		cities = data[provices].child;//将市提取出来
		for(var j in cities){
			var cityselect = new Option(cities[j].name, j);
			citys.appendChild(cityselect);//将市动态添加到下拉框中
		}		
	}
	citys.onchange = function () {
		areas.options.length = 0;//区的选择长度变为0
		var city = this.value; //将当前市的值提取出来
		newarea = cities[city].child; //将区提取出来
		for(var k in newarea){ //遍历区
			var areaselect = new Option(newarea[k], k);
			areas.appendChild(areaselect);
		}
	}