<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="width: 100; height: 100;">

        Your lunch selection will appear here</div>

</body>

</html>

　　

结果：

总结：
responseXML不能写成responseXml

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

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

Ajax学习笔记2之使用Ajax和XML的更多相关文章

  1. ajax学习笔记(原生js的ajax)

    ajax是一个与服务器端语言无关的技术,可以使用在任何语言环境下的web项目(如JSP,PHP,ASP等). ajax优点: 1) 页面无刷新的动态数据交互 2) 局部刷新页面 3) 界面的美观 4) ...

  2. Ajax学习笔记之一----------第一个Ajax Demo[转载]

    原文地址: http://www.cnblogs.com/pjx412/archive/2011/05/04/2037014.html 一.核心推动力:XMLHttpRequest对象XMLHttpR ...

  3. AJAX学习笔记——jQuery中的AJAX

    用jQuery实现Ajax jQuery.ajax([settings]) 1.type:类型, "POST"或"GET" ,默认为"GET" ...

  4. AJax 学习笔记二(onreadystatechange的作用)

    AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...

  5. jQuery学习笔记之jQuery的Ajax（3）

    jQuery学习笔记之jQuery的Ajax(3) 6.jQuery的Ajax插件 源码地址: https://github.com/iyun/jQueryDemo.git ------------- ...

  6. Django学习笔记（14）——AJAX与Form组件知识补充（局部钩子和全局钩子详解）

    我在之前做了一个关于AJAX和form组件的笔记,可以参考:Django学习笔记(8)——前后台数据交互实战(AJAX):Django学习笔记(6)——Form表单 我觉得自己在写Django笔记(8 ...

  7. Ajax学习笔记demo

    AJAX学习 AJAX简介: 全称:Asynchronous JavaScript and XML (JavaScript执行异步网络请求(JS和XML)),通过AJAX可以在浏览器向服务器发送异步请 ...

  8. Jquery ajax 学习笔记

    本人的js & jq 一直是菜鸟级别,最近不忙就看了看ajax方面的知识,文中部分内容参考自这里&这里 之前一直用js写ajax现在基于jq实现方便多了~ $.get & $. ...

  9. Ajax学习笔记1之第一个Ajax应用程序

    代码 <head> <title>An Ajax demo</title> <script src="../js/jquery-1.4.1.js&q ...

随机推荐

  1. Visual Studio 2015速递(2)——提升效率和质量(VS2015核心竞争力)

    系列文章 Visual Studio 2015速递(1)——C#6.0新特性怎么用 Visual Studio 2015速递(2)——提升效率和质量(VS2015核心竞争力) Visual Studi ...

  2. 国外社交网站获取分享数量APIs

    之前有一篇文章详细介绍了如何获取网页在Facebook,Twitter和LinkedIn社交平台上分享的数量,点击这里查看.这里再扩充一下! Twitter GET URL: http://cdn.a ...

  3. Senparc.Weixin.MP SDK 微信公众平台开发教程（三）：微信公众平台开发验证

    要对接微信公众平台的"开发模式",即对接到自己的网站程序,必须在注册成功之后(见Senparc.Weixin.MP SDK 微信公众平台开发教程(一):微信公众平台注册),等待官方 ...

  4. Android开发学习之路-回调实现Service向activity传递数据

    开启服务的时候,如果我们是通过bindService来绑定服务并且要向服务传递数据,可以直接在Intent中设置bundle来达到效果,但是如果是我们需要从服务中返回一些数据到Activity中的时候 ...

  5. [转载] fail-fast总结(通过ArrayList来说明fail-fast的原理、解决办法)

    说明: 转载自http://www.cnblogs.com/skywang12345/p/3308762.html概要 前面,我们已经学习了ArrayList.接下来,我们以ArrayList为例,对 ...

  6. Atitit usrQBM1603短信验证码规范

    Atitit usrQBM1603短信验证码规范 短信验证码扩展至短信服务和验证码服务1 主要方法1 参考模板1 短信验证码扩展至短信服务和验证码服务 主要方法 Line 27: public cla ...

  7. Android笔记——探究活动

    1.活动是什么       活动(Activity)是最容易吸引到用户的地方了,它是一种可以包含用户界面的组件,主要用于和用户进行交互.一个应用程序中可以包含零个或多个活动,但不包含任何活动的应用程序 ...

  8. 为什么项目的jar包会和tomcat的jar包冲突？

    为什么项目的jar包会和tomcat的jar包冲突? 碰到这个问题,猜测tomcat启动时会将自己的lib和项目的lib在逻辑上归并为一个大的lib,但是并没有做版本区分以及去重,这样相同的包可能就有 ...

  9. 支持自动切换的tab标签代码札记

    html代码如下: <!-- tab标签代码begin --> <div class="tab1" id="tab1"> <div ...

  10. SQL Server Window Function 窗体函数读书笔记二 - A Detailed Look at Window Functions

    这一章主要是介绍 窗体中的 Aggregate 函数, Rank 函数, Distribution 函数以及 Offset 函数. Window Aggregate 函数 Window Aggrega ...