Ajax简单实例

最新推荐文章于 2021-10-09 08:08:52 发布

zhangzhifei1991

最新推荐文章于 2021-10-09 08:08:52 发布

阅读量305

点赞数

分类专栏： web前端--Ajax

本文链接：https://blog.csdn.net/zhangzhifei1991/article/details/40801887

版权

web前端--Ajax 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

html文件数据传输

源代码：

与XML格式的数据进行交换，源代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<script>
window.onload = function(){

var nodes = document.getElementsByTagName("a");

for(var i = 0 ;i < nodes.length ; i++){
nodes[i].onclick = 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){
//结果为xml格式，所以需要使用responseXML
var result = request.responseXML;
//结果为xml格式，不能直接使用，必须进行解析后使用
var name = result.getElementsByTagName("name")[0].firstChild.nodeValue;
var address = result.getElementsByTagName("address")[0].firstChild.nodeValue;
var email = result.getElementsByTagName("email")[0].firstChild.nodeValue;

var anode = document.createElement("a");
anode.appendChild(document.createTextNode(name));
anode.href = "mailto "+email;

var hnode = document.createElement("h2");
hnode.appendChild(anode);
var nn = document.getElementById("show");
show.innerHTML="";
nn.appendChild(hnode);
}
}
}
return false;
}

}
}

</script>
<ul>
<li><a href="andy.xml">andy.xml</a>
<li><a href="hatty.html">hatty.html</a>
<li><a href="jone.htnl">jone.html</a>
</ul>
<div id="show">

</div>
</body>
</html>

zhangzhifei1991

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ajax简单实例

html文件数据传输源代码：Insert title herewindow.onload = function(){var nodes = document.getElementsByTagName("a");for(var i = 0 ;i nodes[i].onclick = function(){var request = ne
复制链接

扫一扫