JS增强总结第三天（JS解析xml文件案例）
日期：2014-05-16 浏览次数：20328 次
<!DOCTYPE html>
<html>
<head>
<title>js_city.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="./js/js_xml.js"></script>
</head>
<body>
<div align="center">
<select id="province"></select>
<select id="city"></select>
</div>
</body>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<china>
<province name="北京市">
<city>海淀区</city>
<city>朝阳区</city>
<city>大兴区</city>
<city>昌平区</city>
</province>
<province name="天津市">
<city>北辰区</city>
<city>和平区</city>
<city>虹桥区</city>
<city>AA区</city>
</province>
<province name="上海市">
<city>BB区</city>
<city>CC区</city>
<city>DD区</city>
<city>MM区</city>
</province>
</china>
<!DOCTYPE html>
<html><head>
<title>js_select.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
window.onload = function() {
// 采用数组来存放 js原生格式，二级联动
var provinces = [ {
id : '1',
name : '北京',
city : [ '海淀区', '朝阳区', '大兴区' ]
}, {
id : '2',
name : '天津',
city : [ '北辰区', '和平区', '虹桥区' ]
}, {
id : '3',
name : '上海',
city : [ 'A区', 'B区', 'C区' ]
}, {
id : '4',
name : '重庆',
city : [ 'WW区', 'EE区', 'TT区' ]
} ];
// 页面加载时，显示省份
var domProvinces = document.getElementById("province");
// 遍历省份集合
for ( var i = 0; i < provinces.length; i++) {
// 获取具体省份对象
var pro = provinces[i];
// 创建
