javascript中XMLHttpRequest对象同步获取XML数据

5 篇文章 0 订阅
4 篇文章 0 订阅

XMLHttpRequest对象是一个利器,通过它可以在不重新加载整个页面的情况下实现对网页数据的局部更新,XML是用来存储传输数据的可扩展标记语言,这两个又是AJAX的核心。弄了个小例子捋一捋。new.xml来源于网络。test.html我放在我wamp环境下的www目录下,虽然并不影响运行。在这其中出现了XML数据无法读取的问题,我的这篇博客有具体的解决过程。

<!DOCTYPE HTML>
<html>
<meta charset="utf-8"></meta>
<head>
<script>
if(window.XMLHttpRequest)
{
    demo=new XMLHttpRequest(); //IE7以上
}
else
{
    demo=new ActiveXObject("Microsoft.XMLHTTP"); //IE7以下
}
//规定请求的类型,URL,不进行异步处理
demo.open("GET","./new.xml",false);
//发送请求到服务器
demo.send();
//对请求的响应,解析为 XML 并作为 Document 对象返回
doc=demo.responseXML;
mess=doc.getElementsByTagName("CD");
//解析信息
function displayCD()
{
artist=(mess[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(mess[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(mess[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Artist: " + artist + "<br>Title: " + title + "<br>Year: "+ year;
//将解析的对象信息放在在ID为showCD的html元素中显示
document.getElementById("showCD").innerHTML=txt;
}
i=0;
function next()
{
    if(i<mess.length-1)
    {
        i++;
        displayCD();
    }
}
function previous()
{
    if(i>0)
    {
        i--;
        displayCD();
    }
}
</script>
</head>
<body onload="displayCD()">
</body>
<div id='showCD'>
</div>
<input type="button" onclick="previous()" value="上一条" style="width:100px height:5px"></input>
<input type="button" onclick="next()" value="下一条" style="width:10px height:5px"></input>

</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值