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. Definition of:payload

    (1) Refers to the "actual data" in a packet or file minus all headers attached for transpo ...

  2. c#计算2个字符串的相似度

    直接来代码 public static float levenshtein(string str1, string str2) { //计算两个字符串的长度. int len1 = str1.Leng ...

  3. windows 常用操作

      资源管理器 资源管理器中进入上一级目录:Alt+向上箭头     常用命令行命令 打开windows服务:services.msc     以管理员身份运行程序 按下Win键,在打开的窗口中输入命 ...

  4. NetCat,在网络工具中有“瑞士军刀”美誉

    nc命令详解   NetCat,在网络工具中有“瑞士军刀”美誉,其有Windows和Linux的版本.因为它短小精悍(1.84版本也不过25k,旧版本或缩减版甚至更小).功能实用,被设计为一个简单.可 ...

  5. django restul webservice返回json数据

    做这个demo的前提是你已经配好了python ,django ,djangorestframwork(在我的上一篇博客中有介绍,大家也可以google),mysql-python等. djangor ...

  6. mvc+linq+EF对数据表的查删改

    /// <summary> /// 查询数据库中学生姓名 /// </summary> /// <returns></returns> public A ...

  7. HTML5 前端框架和开发工具【下篇】

    HTML5 前端框架和开发工具[下篇] 快速,安全,响应式,互动和美丽,这些优点吸引更多的 Web 开发人员使用 HTML5.HTML5 有许多新的特性功能,允许开发人员和设计师创建应用程序和网站,带 ...

  8. ngx-push-stream模块源码学习(一)——序言

    一.概述     与传统的request-response的web应用模式不同,comet是一种长连接(long-held)的应用模式,从而允许服务端主动向客户端推送数据.     主流的comet技 ...

  9. Lambda应用模式

    Lambda应用模式 前言 在使用 Lambda 表达式时,我们常会碰到一些典型的应用场景,而从常用场景中抽取出来的应用方式可以描述为应用模式.这些模式可能不全是新的模式,有的参考自 JavaScri ...

  10. IP选路

    IP选路 1.概述      路由算法是用于获取路由表中的路由项目.它是路由选择协议的核心. 2.路由算法的分类      从路由算法能否随网络的通信量或拓扑自适应的进行调整变化来分,可以分为两类. ...