天天看點

XML在Web中的簡單應用

首先建立一個Area.html,很簡單包含一個省份的select元素和一個城市的界面元素:

<html> 
<head> 
<title>Area Demo</title> 
</head> 
<body> 
<select id="province" size=1 οnchange="loadCity()"> 
<option value="city01.xml">  江蘇  </option> 
<option value="city02.xml">  º湖南 </option> 
<option value="city03.xml">  湖北  </option> 
</select> 
<select id="city" size=1> 
</select> 
<xml id="xmlobj"></xml> 
<script language="javascript" type="text/javascript"> 
var provobj = document.all("province"); 
var cityobj = document.all("city"); 
var xmlhttp = document.all("xmlobj"); 
loadCity(); 
/** 
 * 裝載城市資料 
 */ 
function loadCity() { 
 cityobj.options.length = 0; 
 var file = provobj.options[provobj.selectedIndex].value; 
 xmlhttp.async = false; 
 xmlhttp.load(file); 
 var cities = xmlhttp.selectNodes("Cities/City"); 
 var idx,name;  for(idx = 0; idx < cities.length; idx ++) { 
  name = cities[idx].getAttribute("name"); 
  cityobj.options.length++; 
  cityobj.options[cityobj.options.length - 1].value = name; 
  cityobj.options[cityobj.options.length - 1].text = name; 
 } 
} 
</script> 
</body> 
</html>      
<?xml version="1.0" encoding="GB2312"?> 
<Cities Province="江蘇"> 
 <City name="南京"/> 
</Cities> <?xml version="1.0" encoding="GB2312"?> 
<Cities Province="湖南"> 
 <City name="長沙"/> 
</Cities> <?xml version="1.0" encoding="GB2312"?> 
<Cities Province="湖北"> 
 <City name="武漢"/> 
</Cities>      

繼續閱讀