AJAX之XMLHttpRequest

AJAX(asynchronous Javascript And XML),是指一种创建交互式网页应用的网页开发技术。主要通过后台与服务器进行少量数据交换,实现异步更新。AJAX的核心是JavaScript对象XMLhttpRequest。

XMLHttpRequest对象可以在不向服务器提交整个页面的情况下,实现局部更新网页。当页面全部加载完毕后,客户端通过该对象向服务器请求数据,服务器端接受数据并处理后,向客户端反馈数据。 XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步返回 Web 服务器的响应,并且能以文本或者一个 DOM 文档形式返回内容。尽管名为
XMLHttpRequest,它并不限于和 XML 文档一起使用:它可以接收任何形式的文本文档。XMLHttpRequest 对象是名为 AJAX 的 Web 应用程序架构的一项关键功能。

对于不同的浏览器,使用不同的方法来创建XMLHttpRequest对象。IE使用ActiveXObject,而其他浏览器使用名为XMLHttpRequest的javascript内建对象。要克服各个浏览器的差异,可以使用如下一段简单的代码:

var XMLHttp=null;
if (window.XMLHttpRequest)
{
XMLHttp=new XMLHttpRequest()
}else if (window.ActiveXObject)
{
XMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
}

XMLHttpRequest五个状态:

HTTP请求的状态,但一个XMLHttpRequest除此创建时,readyState属性的值从0开始,直到接收完整的HTTP响应,这个值增加到4,每一个状态都有一个相关联的非正式的名称,如下所示:

状态 名称 描述
0 Uninitialized 初始化状态,XMLHttpRequest对象已创建或已被abort()方法重置
1 Open open()方法已调用,但是send()方法未调用。请求还没有被发送。
2 Send Send()方法已调用,HTTP请求已发送到WEB服务器,未接收到响应
3 Receiving 所有响应头部都已经接收到。响应体开始接收但未完成
4 Loaded Http响应已完全接收

注意事项:

1.不同浏览器中,对象建立方式不同。

2.设置回调函数时,不要在函数名后面加括号。

3.Open方法最多有五个参数,其中前三个是必须的

4.回调函数中,最好将判断readyState和status的两个if条件分开写。

5.当前服务器端没有正确返回XML数据时,在javascript中使用responseXML的方式获取返回的xml数据对应的DOM对象时,FireFox和IE的结果是有差别的。

刚刚接触AJAX,简单的从宏观上做个总结,在深一步的结束后,在做完善。如有错误,欢迎指出!!

时间: 2024-10-29 19:11:38

AJAX之XMLHttpRequest的相关文章

AJAX入门--- XMLHttpRequest对象的属性和方法

由于刚刚接触到Ajax对其比较陌生,而其中的XMLHttpRequest对象更是未曾听闻.开始学之前,了解一下它的属性和方法为它的使用做下铺垫.本文重点介绍XMLHttpRequest的属性和方法. XMLHttpRequest对象的属性和事件 属性 描述 readyState 表示XMLHttpRequest对象的状态[1] responseText 包含客户端接收到的HTTP相应的文本内容[2] responseXML 服务器响应的XML内容对应的DOM对象[3] status 服务器返回h

详解AJAX核心 —— XMLHttpRequest 对象 (下)

继续上一篇的内容上一篇关于XMLHttpRequest 对象发送对服务器的请求只说到了用Get方式,没有说Post方式的.那是因为要说Post方式就需要先说另外一个东西,那就是DOM(Document Object Model)文档对象模型.JavaScript通过DOM读取.改变或者删除 HTML.XHTML 以及 XML中的元素,可以重构整个 HTML 文档.可以添加.移除.改变或重排页面上的项目,而且这样的操作会马上显示在页面上.另外,所有浏览器执行W3C 发布的 DOM 标准规范,DOM

详解AJAX核心 —— XMLHttpRequest 对象 (上)

我要说的内容都是非常基础的内容,高手就免看了,如果看了欢迎给点意见啊.新手或者对低层还不是很了解的人可以看看,帮助理解与记忆. XMLHttpRequest 对象是AJAX功能的核心,要开发AJAX程序必须从了解XMLHttpRequest 对象开始. 了解XMLHttpRequest 对象就先从创建XMLHttpRequest 对象开始,在不同的浏览器中创建XMLHttpRequest 对象使用不同的方法: 先看看IE创建XMLHttpRequest 对象的方法(方法1): var xmlht

AJAX - 创建 XMLHttpRequest 对象

XMLHttpRequest 是 AJAX 的基础. XMLHttpRequest 对象 所有现代浏览器均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject). XMLHttpRequest 用于在后台与服务器交换数据.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 创建 XMLHttpRequest 对象 所有现代浏览器(IE7+.Firefox.Chrome.Safari 以及 Opera)均内建 XMLHttpRequest

AJAX——核心XMLHttpRequest对象

AJAX——核心XMLHttpRequest对象

一个Ajax的XMLHttpRequest的open方法实例(只能兼容IE10及以上的浏览器)

Ajax的XMLHttpRequest的open方法 <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>浏览器通过JS控制输入的地址参数不同获取服务器内容(只能兼容IE10及以上的浏览器)</title>    <style>        body{font-family: '宋体';

Egret和Http请求 (Ajax、XMLHttpRequest、Post、Get)

一  Http请求 二  AJax和XMLHttpRequest 三  一个Ajax例子 四 Egret中的egret.HttpRequest 五 Post和Get区别 一 Http请求 Http深入浅出  http://www.cnblogs.com/yin-jingyu/archive/2011/08/01/2123548.html http请求返回码  http://blog.chinaunix.net/uid-25311424-id-3052306.html 二 Ajax和XMLHttp

ajax重构XMLHttpRequest

//重构XMLHttpRequestvar net = new Object(); //名字空間對象 net.READY_STATE_UNINITIALIZED = 0; net.READY_STATE_LOADING = 1; net.READY_STATE_LOADED = 2; net.READY_STATE_INTERACTIVE = 3; net.READY_STATE_COMPLETE = 4; net.ContentLoader = function(url, onload, on

原生Ajax(XMLHttpRequest)

一.什么是Ajax: 全称Asynchronous JavaScript and XML: 异步的 JavaScript 和 XML: 可以在不重新加载整个页面的情况下(偷偷发数据),与服务器交换数据并更新部分网页内容: 二.Ajax之XMLHttpRequest: 1)五步使用法: 1.创建XMLHTTPRequest对象 2.使用open方法设置和服务器的交互信息 3.设置发送的数据,开始和服务器端交互 4.拿到数据后执行相关操作 这是GET请求: HTML: <a class="bt

原生实现ajax解析--XMLHttpRequest

ajax基础: Asynchronous JavaScript and XML,意思就是用JavaScript执行异步网络请求. 如果仔细观察一个Form的提交,你就会发现,一旦用户点击“Submit”按钮,表单开始提交,浏览器就会刷新页面,然后在新页面里告诉你操作是成功了还是失败了.如果不幸由于网络太慢或者其他原因,就会得到一个404页面.一次HTTP请求对应一个页面. 如果要让用户留在当前页面中,同时发出新的HTTP请求,就必须用JavaScript发送这个新请求,接收到数据后,再用Java