學習筆記--Ajax:XML格式返回數據

二。XML


在index.html中

<span style="font-size:14px;"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML//EN">
<html>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<head>
		<script type="text/javascript">
			window.οnlοad=function(){
				var aNodes=document.getElementsByTagName("a");
				for(var i=0;i<aNodes.length;i++){
					aNodes[i].οnclick=function(){
						var request=new XMLHttpRequest();
						var method="GET";
						var url=this.href;
						request.open(method,url);
						request.send(null);
						request.onreadystatechange=function(){
							if(request.readyState==4){
								if(request.status==200 ||request.status==304){
									//1.結果爲xml格式,所有需要responseXML來獲取
									var result=request.responseXML;
									//獲取xml中的元素節點的文本節點
									var name=result.getElementsByTagName("name")[0].firstChild.nodeValue;
									var website=result.getElementsByTagName("website")[0].firstChild.nodeValue;
									var email=result.getElementsByTagName("email")[0].firstChild.nodeValue;
									//2.結果不能直接使用,必須先創建相應的節點,再把節點加到“#divtext”中
									//目標格式爲:
									/*
										 <h2><a href="#">andy</a></h2>
										 <a href="#">http://www.baidu.com</a>
									 
									*/
									var aNode=document.createElement("a");
									aNode.appendChild(document.createTextNode(name));
									aNode.href="mailto"+email;
									
									var h2Node=document.createElement("h2");
									h2Node.appendChild(aNode);
									
									var aNode2=document.createElement("a");
									aNode2.appendChild(document.createTextNode(website));
									aNode2.href=website;
									
									var divtext=document.getElementById("divtext");
									divtext.innerHTML="";
									divtext.appendChild(h2Node);
									divtext.appendChild(aNode2);
								
								}
							}
						};
						return false;
					};
				}
			};
		</script>
	</head>
	<body>
		<h1>People</h1>
		<ul>
			<li><a href="files/andy.xml">andy</a></li>
			<li><a href="files/jeremy.xml">jeremy</a></li>
			<li><a href="files/richar.xml">richar</a></li>
		</ul>
		<div id="divtext"> </div>
	</body>
<span style="font-family:KaiTi_GB2312;"></html></span></span>

在andy.xml / jeremy.xml / richar.xml中

<?xml version="1.0" encoding="utf-8"?>
<details>
	<name>andy</name>
	<website>http://www.baidu.com</website>
	<email>email</email>
</details>

<?xml version="1.0" encoding="utf-8"?>
<details>
	<name>jeremy</name>
	<website>http://www.baidu.com</website>
	<email>email</email>
</details>


<span style="font-size:14px;"><?xml version="1.0" encoding="utf-8"?>
<details>
	<name>richar</name>
	<website>http://www.baidu.com</website>
	<email>email</email>
</details></span>




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章