如何创建和使用XMLHttpRequest对象？
创建XMLHttpRequest对象，我有以下几种方法，顺带给大家介绍下他们的使用，一起来看看那吧。
1. 第一种，我们可以使用构造函数的方式。直接new的方式，这样我们就构造了这个对象。
request = new XMLHttpRequest()
但是，这个语句只针对Firefox，opera以及Safari等高级浏览器。
2、如果我们要针对IE6或者IE6以上的。那么，我们需要换一个方式，然后里面还要传一些参数。
xmlhttp = new ActiveXObject('Msxml2.XMLHTTP')
3、假如这样创建还是不成功，那我们就要换一个方式，就是修改里面的一些参数。
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP')
4、如果以上3种方式，还不能创建这个对象，那这个用户使用的浏览器就是过时的。我们可以提示它，浏览器不支持ajax技术。
运行注意
1) 我们创建的这个对象，首先必须运行在web服务器中的一个网页中，因为它依赖于JavaScript。JavaScript必须在网页中执行。
2) 我们一定要注意这个网页的编码。不然，通过这个异步获取的数据，有可能是乱码。
代码演示
1. 这是一个我写好的网页代码开始的模板。这里面我绑定了一个onclick事件，调用doAjax函数。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajax初步入门教学视频-麦子学院</title>
</head>
<body>
<script type="text/javascript">
function doAjax(the_request)
{
}
</script>
<input type="button" onclick="doAjax('ajax-02.txt')" />
<br/><br/>
<div id="vv"></div>
</body>
</html>
2. 填充这个函数里面的内容
1) 首先，我们定义一个默认为null的变量。
var request = null;
2) 然后我们就判断我们的浏览器，我们根据这个浏览器是否支持这个对象，来生成这个request对象。
它如果支持，我们就直接用构造函数：
if (window.XMLHttpRequest) {
request = new XMLHttpRquest() ;
}
它如果不支持这个对象，我们就使用第二种方式生成：
else if (window.ActiveXObject) {
request = new ActiveXObject('Microsoft.XMLHTTP');
}
这样我们就创建好了。
然后就是else，我们也不再去判断另外一种方式了，我们直接给用户提示。
else {
alert("您的浏览器不支持ajax");
return false;
}
3) 因为是个函数，所以必须要有返回值，我们就返回false。
return false;
4) 好，这就是我们生成XMLHttpRequest对象的代码了。
3. 我们在向服务器发送数据之前，我们有必要了解这个对象的一些属性。
它有3个比较重要的属性。
1) 第一个是我们的onreadystatechange这个属性。
这个属性有什么作用呢？
它存储处理服务器响应的函数。
假如这个request是我们已经生成好的对象，然后我给它的属性赋一个空函数，里面写一些代码。
request.onreadystatechange = function() {
//这里要写一些代码
}
2) 第二个属性是readyState。
它用来存储服务器响应的状态信息。
每当它的状态值改变的时候，onreadystatechange这个属性对应的函数就要被调用一次。
这个readyState属性有5个值。
a) 0：表示请求未初始化，也就是还没有发起请求。
b) 1：表示请求已经提出，在请求发出去之前。
c) 2：表示请求已发送，这里通常可以从响应得到头部信息。
d) 3：表示服务器已经正在处理中，但是没有响应完成。
e) 4：表示服务器已经请求完成，并且使用它。
这个readyState，其实针对的这些状态，我们都要调用onreadystatechange对应的函数。
那，我们必须要在这个函数里面写上一条if语句，才能判断我们的响应是否已经完成，意味着是否可以获取异步的数据。
好，我们在这里示范一下：
request.onreadystatechange = function() {
//这里要写一些代码
if (request.readyState == 4) {
//从服务器获取数据的代码，并做相应处理
}
}
3) 那，接下来这个属性叫做：responseText。
这个属性是用来获取，由服务器返回的数据，就是当
readyState为4的时候，我们可以获取到数据。
例如：我们把它打印出来。
request.onreadystatechange = function() {
//这里要写一些代码
if (request.readyState == 4) {
//从服务器获取数据的代码，并做相应处理
alert(request.responseText);
}
}
这样我们就把这个服务器返回的数据alert出来了。
4. 但是我们要把请求发送到服务器，那我们就要调用它的两个方法。
1) 第一个是open()，这个参数需要3个参数。
a) 第一个参数是GET或者是POST，表名这个HTTP方法
b) 第二个参数就是规定服务器端脚本的url。
c) 第三个参数，规定应当对请求作异步的处理，也就是一个异步处理的标识。
2) 第二个方法：就是send()方法，send方法可以将请求发送到服务器端。
我们假设当前这个网页，跟我们请求的url在同一个目录下面。
a) 那我们的代码可以是这样的。
request.open("GET", "test.txt", true);
这个时候，我们就已经建立了这个请求。
b) 然后，加一个对服务器响应状态的代码。
request.onreadystatechange = function() {
//这里要写一些代码
if (request.readyState == 4) {
//从服务器获取数据的代码，并做相应处理
alert(request.responseText);
}
}
c) 然后，我们就可以通过send方法，将我们的请求发送给服务器端。
接下来，我们就可以在方法里面做一些处理了。
做处理的时候，我们其实什么也不用做，只要等到
request.readyState == 4的时候，才做一些处理。
做处理，其实一般来说，就是获取这个
responseText这个属性，把它里面的数据做一下解析，然后在相应的网页位置展示出来。
这就是我们的ajax里面的核心技术。
原文链接：http://www.maiziedu.com/wiki/ajax/base/
如何创建和使用XMLHttpRequest对象？的更多相关文章
- JS创建Ajax的XMLHttpRequest对象的通用方法
function createXMLHttpRequest() { var request = false; if(window.XMLHttpRequest) { request = new XML ...
- 用js创建XMLHttpRequest对象池[转]
//使用literal语法定义一个对象:XMLHttp var XMLHttp = { //定义第一个属性,该属性用于缓存XMLHttpRequest对象的数组 XMLHttpRequestPool: ...
- Ajax中的XMLHttpRequest对象详解
XMLHttpRequest对象是Ajax技术的核心.在Internet Explorer 5中,XMLHttpRequest对象以ActiveX对象引入,被称之为XMLHTTP,它是一种支持异步请求 ...
- 详解AJAX核心 —— XMLHttpRequest 对象 (上)
我要说的内容都是非常基础的内容,高手就免看了,如果看了欢迎给点意见啊.新手或者对低层还不是很了解的人可以看看,帮助理解与记忆. XMLHttpRequest 对象是AJAX功能的核心,要开发AJAX程 ...
- Ajax学习（三）——XMLHttpRequest对象的五步使使用方法
Ajax的核心技术是XMLHttpRequest对象,它能够在不向server提交整个页面的情况下.实现局部更新网页.通过这个对象,Ajax能够像桌面应用程序那样仅仅与server进行数据层的 ...
- 详解AJAX核心中的XMLHttpRequest对象
转自:http://developer.51cto.com/art/200904/119577.htm XMLHttpRequest 对象是AJAX功能的核心,要开发AJAX程序必须从了解XMLHtt ...
- Ajax中的XMLHttpRequest对象详解(转)
XMLHttpRequest对象是Ajax技术的核心.在Internet Explorer 5中,XMLHttpRequest对象以ActiveX对象引入,被称之为XMLHTTP,它是一种支持异步请求 ...
- XMLHttpRequest对象解读
<!DOCTYPE html> <html> <body> <script> function reqListener () { console.log ...
- XMLHttpRequest对象的属性与方法
XMLHttpRequest对象是Ajax的核心,它有很多属性和方法.1,readyState属性当一个XMLHttpRequest对象被创立后,readyState属性标示了当前对象处于什么状态,可 ...
随机推荐
- Mac环境下用Java(Sikuli+Robot)实现页游自动化
转载请注明出自天外归云的博客园:http://www.cnblogs.com/LanTianYou/ Sikulix(以前叫Sikuli)在Mac电脑的环境配置步骤如下: 1.从官网上下载Sikuli ...
- Mybatis 和 Spring配置
一.使用的jar包就不详细讲解了,下载了Mybatis 和 Spring 的jar包基本上都添加上去了. 一图概括:(这是我使用的ar包,有些不是Mybatis 和 Spring 的 ) 二. web ...
- Android Context完全解析
Context类型 我们知道,Android应用都是使用Java语言来编写的,那么大家可以思考一下,一个Android程序和一个Java程序,他们最大的区别在哪里?划分界限又是什么呢?其实简单点分析, ...
- grails-shiro权限认证
一.引用shiro插件 //在BuildConfig的plugins下面添加 compile ":shiro:1.2.1" 二.引用新插件后要进行编译 //grails命令 com ...
- MUI 版本更新
MUI版本更新,一些js,css 就不写了. 一.app 端 1.APP html 代码 <li class="mui-table-view-cell"> <a ...
- Intent官方教程(6)常见Intent示例,启动日历，时钟，镜头等。
guide/components/intents-common.html 包含:Alarm Clock Calendar Camera Contacts/People App Email File S ...
- mysql 修改数据库的列
alter table tableName oldcolumn newcolumn datatype;
- c#启动EXE文件（简单的）
在程序执行中会遇到启动本软件的exe问,或者启用其它的exe文件,已达到执行某些操作的作用.下面是两种最常见的启动exe文件. 1.调用系统dll使用其提供的方法. 引用的dll, [DllImpor ...
- wifi漫游测试过程
欢迎加入Wince技术讨论群QQ#326444254 这个是我最近测试wifi漫游的一些方法,后续会继续更新,让大家了解测试wifi漫游的方法,由于现在支持wince wifi驱动的厂家非常少,所以支 ...
- uTenux——LED驱动讲解
LED驱动讲解,对于一个嵌入式的工程师还是一个刚开是学习相关电子设计的朋友,对于LED的驱动问题应该不甚陌生.我所说的LED驱动并不是类似大功率LED照明的那个驱动,而是简单的控制器对LED的控制驱动 ...