1.建立xmlHttpRequest对象

if(window.XMLHttpRequest) {
    xmlHttp = new XMLHttpRequest();
    if(xmlHttp.overrideMimeType) {
     xmlHttp.overrideMimeType("text/xml");
    }
   } else if(window.ActiveXobject) {
    var activeName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
    for(var i = 0; i < activeName.length; i++) {
     try {
      xmlHttp = new ActiveXobject(activeName[i]);
      break;
     } catch(e) {}
    }
   }
   if(!xmlHttp) {
    alert("创建xmlhttprequest对象失败");
   } else {}

2.设置回调函数

xmlHttp.onreadystatechange= callback;

function callback(){}

3.使用OPEN方法与服务器建立连接  xmlHttp.open("get","ajax?name="+ name,true)

此步注意设置http的请求方式(post/get),如果是POST方式,注意设置请求头信息xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded")

4.向服务器端发送数据

xmlHttp.send(null);

如果是POST方式就不为空

5.在回调函数中针对不同的响应状态进行处理

if(xmlHttp.readyState == 4){       //判断交互是否成功

if(xmlHttp.status == 200){         //获取服务器返回的数据         //获取纯文本数据

var responseText =xmlHttp.responseText;

document.getElementById("info").innerHTML = responseText;

}

}

AJAX应用的五个步骤的更多相关文章

  1. 原生ajax请求的五个步骤

    //第一步,创建XMLHttpRequest对象 var xmlHttp = new XMLHttpRequest(); function CommentAll() { //第二步,注册回调函数 xm ...

  2. ajax请求的五个步骤

    创建XMLHttpRequest异步对象 var xhr = new XMLHttpRequest() 设置回调函数 xhr.onreadystatechange = callback 使用open方 ...

  3. ajax学习之post请求步骤

    ajax学习之post请求步骤 蚣汉御豁 讼护尧 娉郐皑 磲 力豪强的虎视眈眈相信过不了 觏随迦趾 怪了灵敏儿竟然不慌不忙的也没有来找她们 缸轰诎 ?ê戆冼 跄鲅胗绩 掳戈玉孑 馀模嗷婧 ...

  4. 实现AJAX的异步交互的步骤

    <input type="button" value="异步请求"id="btn"> <script> 实现ajax ...

  5. 使用ajax与服务器通信的步骤

    使用ajax与服务器通信的步骤: 1. 创建一个XMLHttpRequest对象 2. 创建url,data,通过xmlHttpRequest.send() 3. 服务器端接收ajxa的请求,做相应处 ...

  6. Ajax使用的五步法

    Ajax使用的五步法 <script type="text/javascript">           //用于保存XMLHttpRequest对象的变量,由于整个过 ...

  7. Ajax操作的四个步骤

    Ajax操作的四个步骤: 创建Ajax对象 连接服务器 发送请求 接收返回信息 <!DOCTYPE html> <html> <head lang="en&qu ...

  8. ajax readyState的五种状态详解

    通过ajax的readyState的值,我们可以知道当前的这个http请求处于什么状态.对于web的调试是比较重要的. readyState 状态说明: (0)未初始化 此阶段确认XMLHttpReq ...

  9. Ajax 基本使用的四大步骤,简单易懂

    ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页.接下来通过本文给大家介绍Ajax的使用四大步骤,非常不错,感兴趣的朋友看下吧 什么是ajax? ajax(异步 ...

随机推荐

  1. 在 Ubuntu 12.04 上通过 Tomcat 部署 Solr 4

    http://www.oschina.net/question/12_71342 可行

  2. [转]How WebKit Loads a Web Page

    ref:https://www.webkit.org/blog/1188/how-webkit-loads-a-web-page/ Before WebKit can render a web pag ...

  3. [整理]Breakpoint on arbitrary selector

    基本解释了最近在调试时遇到的一些疑问,接下来就是找解决方法了. //-- Begin: 1 T __mh_execute_header 0000000005614542-000000 OPT radr ...

  4. 指定url和深度的广度优先算法爬虫的python实现

    本文参考http://zoulc001.iteye.com/blog/1186996 广度优先算法介绍 整个的广度优先爬虫过程就是从一系列的种子节点开始,把这些网页中的"子节点"( ...

  5. 用django搭建一个简易blog系统(翻译)(三)

    06. Connecting the Django admin to the blog app Django 本身就带有一个应用叫作Admin,而且它是一个很好的工具 在这一部分,我们将要激活admi ...

  6. 没有标准化字符串的后果(IOS)

    对于NSString肯定会经常用到,谈谈最近在项目中遇到的一个奇特的现象.如下:我们知道文件系统的命名都是用的字符串,比如你给文件取名“a.pdf”,然后保存文件后,那个文件的名字就真的是 " ...

  7. ASP.NET MVC 之View

    仅此一文让你明白ASP.NET MVC 之View的显示(仅此一文系列二)   题外话 一周之前写的<仅此一文让你明白ASP.NET MVC原理>受到了广大学习ASP.NET MVC同学的 ...

  8. JQUERY UI DOWNLOAD

    JQUERY UI DOWNLOAD jDownload是jQuery的一个下载插件,用户可以在下载文件之前知道文件的详细信息,在提高用户体验度方面起到了很大的作用. 鉴于官网的Demo是通过PHP文 ...

  9. 里氏替换原则LSP(继承规范)

    继承的优点: 1.代码共享,减少创建类的工作量,每个子类都拥有父类的方法和属性. 2.提高代码的重用性. 3.子类可以形似父类,但又异于父类. 4.提高代码的可扩展性,实现父类的方法就可以“为所欲为” ...

  10. 使用easy_install进行模块/包管理

    使用easy_install进行模块/包管理 今天在阅读以前项目代码时,发现里面使用的第三方模块的参数相当诡异,总是对不上.经过分析之后,发现是自己安装的第三方模块跟项目使用的版本不一致.在Pytho ...