<!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Insert title here</title>

 <script>

 var xhr=initAjax();

 function initAjax()

 {

     if(window.XMLHttpRequest)

     {

         return new XMLHttpRequest();

     }

     else if(window.ActiveXObject)

     {

         try

         {

             return new ActiveXObject("Msxml2.XMLHttp");

         }

         catch(e)

         {

             try

             {

                 return new ActiveXObject("Microsoft.XMLHttp");

             }

             catch(e)

             {

                 //return undefined

                 alert("Your browser doesn't support AJAX!");

             }

         }

     }

 }

 function showInfo()

 {

     //var xhr=new ActiveXObject("Msxml2.XMLHttp");

     if(xhr!=null)

     {

         xhr.onreadystatechange=xhrStateChange;

         xhr.open("GET","info.xml",true);

         xhr.send(null);

     }

 }

 function xhrStateChange()

 {

     if(xhr.readyState==4)

     {

         document.getElementById("infoDiv").innerHTML=xhr.responseText;

     }

     else if(xhr.readyState==3)

     {

         document.getElementById("infoDiv").innerHTML="Loading...";

     }

 }

 </script>

 </head>

 <body>

 <input type="button" value="click me" onclick="showInfo()">

 <div id="infoDiv"></div>

 </body>

 </html>

initAjax函数实现了对浏览器的兼容(IE5,6), 不过现在ActiveX技术早已过时, 被浏览器默认禁用.

showInfo函数中将xhrStateChange函数绑定到onreadystatechange事件, 注意这种绑定方式不支持传参(只写函数名不能加括号)!!!而且这句代码写在函数外也是可以的.结果如下

第49行如果把innerHTML改为innerText, 则将不考虑xml文件中的标签, 内容原样显示, 如下

另外, xhr除了responseText属性, 还有一个属性:responseXml.

附readyState的各状态

Ajax基本写法的更多相关文章

  1. ajax提交写法

    <script> /* ajax提交写法 */ function add_prize() { // var query={}; var query = new Object(); quer ...

  2. jQuery ajax 标准写法及进度条绘制

    jQuery ajax 标准写法及进度条绘制 $.ajax({ url: "http://www.microsoft.com", //请求的url地址 dataType: &quo ...

  3. JavaScript AJAX原生写法

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  4. jquery ajax分页写法

    jquery ajax分页写法我用的是laypage插件 前端代码<pre> function demo(curr) { $.getJSON('/home/index/getinfo', ...

  5. ajax标准写法

    ajax 标准写法 $.ajax({ url:"http://www.microsoft.com", //请求的url地址 dataType:"json", / ...

  6. JQuery的Ajax标准写法

    Ajax的标准写法 $.ajax({ url:"http://www.xxx",//请求的url地址 dataType:"json",//返回的格式为json ...

  7. Ajax原生写法

    用太久JQuery了,别忘了Ajax原生是怎么写的 var Ajax = { get : function (url, callback) { var req = Ajax.getRequest(ca ...

  8. JQuery中ajax请求写法

    $.ajax({ type: "POST", url: "ygdwController.do?getonygdw", data : "id=" ...

  9. ajax常用写法

    $.ajax( url,{ type:"post", data:{},}) .done(function() { alert("success"); }) .f ...

  10. jquery ajax标准写法

    $.ajax({ url:url,                      //地址 type:'post', //请求方式 还可以是get type不可写成Type 不让会导致数据发送不过去,使用 ...

随机推荐

  1. HDU 1159 Common Subsequence (动规+最长公共子序列)

    Common Subsequence Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Other ...

  2. 桌面系统集成WEB认证系统方案

    最近做的一个项目,有WEB版.WPF版.手机版.领导想集成集团的一个现成的认证系统,姑且称这个认证系统名为 W4认证系统. W4认证系统有如下特点: 1.现成的 2.是个单点登录系统 3.不支持oAu ...

  3. 如何扩大VMware中的ubuntu虚拟机的磁盘大小

    我是在VMware中安装的ubuntu. 最近虚拟机磁盘空间不够,需要扩展,在虚拟机中设置了扩展20G,然后在ubuntu中发现扩展的20G并不能用.... 正确的扩展方法是: 1.先在虚拟机中的se ...

  4. Bootloader - main system - Recovery的三角关系【转】

    本文转载自:http://blog.csdn.net/u012719256/article/details/52304273 一.MTD分区: BOOT:        boot.img,Linux ...

  5. 硬盘-RAID 5组建

    没发正文之前本人先声明一下----本文是转载 这篇文章简直是太精彩了,呵呵 ,实在是忍不住了,一定要贴出来,让大家分享! 原作者:唐华 责任编辑:xiexiaojin 我们生活在一个历史记录在硬盘上的 ...

  6. UNDO表空间不足解决方法

    确认UNDO表空间名称 select name from v$tablespace; 检查数据库UNDO表空间占用空间情况以及数据文件存放位置: select file_name,bytes/1024 ...

  7. CentOS Linux VPS桌面环境一键安装包

  8. 使用GitHub（转载）

    转自:http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000/00137628548491 ...

  9. PCB OD工具破解实例应用

    以下破解Genesis为例,对OD工具使用进行实例讲解 工具简单 介绍下下载地址: OD工具:是一个新的动态追踪工具,将IDA与SoftICE结合起来的思想,Ring 3级调试器, 是为当今最为流行的 ...

  10. Akka源码分析-Remote-位置透明

    上一篇博客中,我们研究了remote模式下如何发消息给远程actor,其实无论如何,最终都是通过RemoteActorRef来发送消息的.另外官网也明确说明了,ActorRef是可以忽略网络位置的,这 ...