风雨砥砺,岁月如歌—利用AJAX获取XML配置文件

我们都知道使用AJAX有很多的好处,但是终究需要用在实践中才能体现出它的妙处,今天我们就来试一试吧。

首先我们建立一个简单的XML文件:

<?xml version="1.0" encoding="utf-8" ?>
<names>
	<name>张二</name>
	<name>张三</name>
	<name>张四</name>
</names>

然后我们就就在HTML获取它的数据:

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <script>
        function loadXMLDoc() {
            var xmlhttp;
            var txt, x, i;
            if (window.XMLHttpRequest) {
                // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
                xmlhttp = new XMLHttpRequest();
            }
            else {
                // IE6, IE5 浏览器执行代码
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    xmlDoc = xmlhttp.responseXML;
                    txt = "";
                    x = xmlDoc.getElementsByTagName("name");
                    for (i = 0; i < x.length; i++) {
                        txt = txt + x[i].childNodes[0].nodeValue + "<br>";
                    }
                    document.getElementById("myDiv").innerHTML = txt;
                }
            }
            xmlhttp.open("GET", "文件/XQ.xml", true);
            xmlhttp.send();
        }
    </script>
</head>

<body>

    <h2>雇员信息:</h2>
    <div id="myDiv"></div>
    <button type="button" onclick="loadXMLDoc()">获取信息</button>

</body>
</html>

那么,我们就成功啦:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 8
    评论
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值