Ajax学习笔记2之使用Ajax和XML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Using Ajax with XML</title>
    <script src="../js/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        var menu;

        //XMLHttpRequest对象:初始化为false;
        var XMLHttpRequestObject = false;

        //创建XMLHttpRequest对象
        if (window.XMLHttpRequest) {
            XMLHttpRequestObject = new XMLHttpRequest();
            //设置下载的数据类型为XML格式
            if (XMLHttpRequestObject.overrideMimeType) {
                XMLHttpRequestObject.overrideMimeType("text/xml");
            }
        }
        else if (window.ActiveXObject) {
            XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
            //设置下载的数据类型为XML格式
            XMLHttpRequestObject.setRequestHeader("text/xml");
        }

        function getmenu(url) {
            if (XMLHttpRequestObject) {
                //打开XMLHttpRequest对象
                XMLHttpRequestObject.open("GET", url);
                //获取XML数据
                XMLHttpRequestObject.onreadystatechange = function () {
                    if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) {
                        var xmlDocument = XMLHttpRequestObject.responseXML;
                        //获得menu1.xml/menu2.xml所有的<mennuitem>标签
                        menu = xmlDocument.getElementsByTagName("menuitem");
                        //alert(menu.length);
                        ListMenu();
                        delete XMLHttpRequestObject;
                        XMLHttpRequest = null;
                    }
                    else {
                        //alert(XMLHttpRequestObject.readyState + "+" + XMLHttpRequestObject.status);
                    }
                }

                //真正执行下载的代码
                XMLHttpRequestObject.send(null);
            }
        }

        //绑定下拉框
        function ListMenu() {
            var loopIndex;
            //获取下拉框控件
            var selectControl = document.getElementById("menuList");
            //循环添加选项到下拉框
            for (loopIndex = 0; loopIndex < menu.length; loopIndex++) {
                selectControl.options[loopIndex] = new Option(menu[loopIndex].firstChild.data);
            }
        }
    </script>
</head>
<body>
    <h1>
        Using Ajax with XML</h1>
    <form>
    <select size="1" id="menuList">
        <!-- onchange="setmenu()"-->
        <option>Select a menu item</option>
    </select>
    <br />
    <br />
    <input type="button" value="Select menu 1" onclick="getmenu('menu1.xml')" /><input
        type="button" value="Select menu 2" onclick="getmenu('menu2.xml')" />
    </form>
    <div id="targetDiv" style=" 100; height: 100;">
        Your lunch selection will appear here</div>
</body>
</html>

  

结果:

总结:
responseXML不能写成responseXml
之前调试一直通不过,找了老半天原来问题是在这,浏览器对responseXml也不报没有该属性或者为null

注:在IE浏览器上按F12调试,只有在版本为10以上时才得到正确结果,在360上没任何问题

原文地址:https://www.cnblogs.com/zhyue93/p/Ajax2.html