开发者学堂课程【Ajax：第五例：省市联动1】学习笔记，与课程紧密联系，让用户快速学习知识。

课程地址：https://developer.aliyun.com/learning/course/31

第五例：省市联动1

省市联动

1、页面

<select name =”province>

 <option>===请选择省份===</option>

</select>

<select name=”city>

 <option>===请选择城市===</option>

</select>

在页面打开就应该把所有省加载出来。

 

2、ProvinServlet

●ProvinceServlet:当页面加载完毕之后马上请求这个servlet

 >他需要加载china.xml文件，把所有的省的名称使用字符串发送给客户端。

 

3、页面的工作：

●获取这个字符串，使用逗号分隔，得到数组；

●循环遍历每个字符串（省份名称），使用每个字符串创建一个<option>元素添加到<select name=”province>这个元素中。

 

4、CityServelt

●CityServlet：当页面选择某个省时，发送请求；

●得到省份名称，加载China.xml文件，查询出该省份对应的元素对象，把这个元素转换成xml字符串，发送给客户端。

 

5、页面的工作

●把<select name=”ciyt>中的所有子元素删除，但不要删除<option>===请选择城市===</opyion>；

●得到服务器的相应结果：doc；

●获取所有的<city>子元素，循环遍历，得到<city>的内容；

●使每个<city>的内容创建一个<option>元素，添加到<select name=”ciyt>。

举例：