XMLHttpRequest 对象

XMLHttpRequest 对象用于在后台与服务器交换数据。

什么是 XMLHttpRequest 对象？

XMLHttpRequest 对象用于在后台与服务器交换数据。

XMLHttpRequest 对象是开发者的梦想，因为您能够：

在不重新加载页面的情况下更新网页
在页面已加载后从服务器请求数据
在页面已加载后从服务器接收数据
在后台向服务器发送数据

所有现代的浏览器都支持 XMLHttpRequest 对象。

创建 XMLHttpRequest 对象

所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象。

通过一行简单的 JavaScript 代码，我们就可以创建 XMLHttpRequest 对象。

创建 XMLHttpRequest 对象的语法：

1 xmlhttp=new XMLHttpRequest();

老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：

1 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

XMLHttpRequest对象的属性：

 1 关于异步与同步
 2 异步传输是面向字符的传输，它的单位是字符；
 3 同步传输是面向比特的传输，它的单位是桢，它传输的时候要求接受方和发送方的时钟是保持一致的。 4 XMLHttpRequest对象的属性。
 5   　　 onreadystatechange  每次状态改变所触发事件的事件处理程序。
 6   　　 responseText     从服务器进程返回数据的字符串形式。
 7   　　 responseXML    从服务器进程返回的DOM兼容的文档数据对象。
 8   　　 status           从服务器返回的数字代码，比如常见的404（未找到）和200（已就绪）
 9   　　 statusText       伴随状态码的字符串信息
10   　　 readyState       对象状态值
11 　　　　 　　0 (未初始化) 对象已建立，但是尚未初始化（尚未调用open方法）
12 　　　　 　　1 (初始化) 对象已建立，尚未调用send方法
13 　　　   　　2 (发送数据) send方法已调用，但是当前的状态及http头未知
14 　　　　 　　3 (数据传送中) 已接收部分数据，因为响应及http头不全，这时通过responseBody和responseText获取部分数据会出现错误，
15 　　　　 　　4 (完成) 数据接收完毕,此时可以通过通过responseXml和responseText获取完整的回应数据
16 　　　　　　　　Method ：Post   发送数据方式 url send（特属于post方式）
17         　　　　　　　　Get 　　发送数据方式  url

配置实例：

 1 !DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 <div id="myTime"></div>
 9 <input id="Button1" type="button" value="Get Time" onclick="creatReq();" >
10
11 <script type="text/javascript" language="javascript">
12     var req; //定义变量，用来创建xmlhttprequest对象
13     function creatReq()  //创建xmlhttprequest,ajax开始
14     {
15         var url = "ajaxServer.aspx"; //要请求的服务端地址
16         if(window.XMLHttpRequest) //非IE浏览器及IE7(7.0及以上版本),用xmlhttprequest对象创建
17         {
18             req = new XMLHttpRequest();
19         }
20         else if(window.ActiveXObject) //IE(6.0及以下版本)浏览器用activexobject对象创建，如果用户浏览器禁用了ActiveX,可能会失败。
21         {
22             req = new ActiveXObject("Microsoft.XMLHttp");
23         }
24         if(req) //成功创建xmlhttprequest
25         {
26             req.open("GET",url, true); //与服务端建立连接(请求方式post或get，地址,true表示异步)
27             req.onreadystatechange = callback;  //指定回调函数
28             req.send(null); //发送请求
29         }
30     }
31     function callback()  //回调函数，对服务端响应处理，监视response状态
32     {
33         if(req.readyState == 4) //请求状态为4表示成功
34         {
35             if(req.status == 200)  //http状态200表示OK
36             {
37                 Display();  //所有状态成功，执行此函数，显示数据
38             }
39             else // http返回状态失败
40             {
41                 alert("服务端返回状态" + req.statusText);
42             }
43         }
44         else //请求状态还没有成功，页面等待
45         {
46             document.getElementById("myTime").innerHTML = "数据加载中...";
47         }
48     }
49
50     function Display()  //接受服务器端返回的数据，对其进行显示
51     {
52         document.getElementById("MyTime").innerHTML = req.responseText;
53     }
54 </script>
55 </body>
56 </html>

View Code

转载于:https://www.cnblogs.com/eric_yi/p/7831664.html

XMLHttpRequest 对象相关推荐

Ajax异步XMLHttpRequest对象
示例Ajax: <%@ page language="java" contentType="text/html; charset=utf-8"pageEn ...
转载 Xmlhttprequest对象池
2019独角兽企业重金招聘Python工程师标准>>> 在ajax应用中,通常一个页面要同时发送多个请求,如果只有一个XMLHttpRequest对象,前面的请求还未完成,后面的就 ...
[转]建一个XMLHttpRequest对象池
在ajax应用中,通常一个页面要同时发送多个请求,如果只有一个XMLHttpRequest对象,前面的请求还未完成,后面的就会把前面的覆盖掉,如果每次都创建一个新的XMLHttpRequest对象,也 ...
艾伟：详解AJAX核心 —— XMLHttpRequest 对象 (下)
继续上一篇的内容上一篇关于XMLHttpRequest 对象发送对服务器的请求只说到了用Get方式,没有说Post方式的.那是因为要说Post方式就需要先说另外一个东西,那就是DOM(Documen ...
XmlHttpRequest 对象详解
最通用的定义为:XmlHttp是一套可以在Javascript.VbScript.Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API.XmlHttp最大的用处是可以更新 ...
介绍一下XMLHttpRequest对象，他有哪些常用方法和属性
XMLHttpRequest是ajax的核心,通过XMLHttpRequest对象,Web开发人员可以在页面加载以后进行页面的局部更新常用的方法: open(get/post,url,是否异步)创建 ...
jquery与ajax的XMLHttpRequest对象介绍
首先认识一个对象这个对象叫XMLHttpRequest XMLHttpRequest对象可以提供在不刷新页面的情况下向服务器发送异步请求,并且接受服务器端返回的结果.从而实现局部更新当前页面的功 ...
JS使用XMLHttpRequest对象POST收发JSON格式数据
JavaScirpt中的XMLHttpRequest对象提供了对 HTTP 协议的完全访问,使用该对象可以在不刷新页面的情况与服务器交互数据.XMLHttpRequest是实现AJAX技术的关键对象, ...
Ajax入门（创建 XMLHttpRequest 对象）
XMLHttpRequest 是 AJAX 的基础. 所有现代浏览器均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject). XMLHttpRequest ...

XMLHttpRequest 对象

XMLHttpRequest 对象用于在后台与服务器交换数据。

什么是 XMLHttpRequest 对象？

创建 XMLHttpRequest 对象

创建 XMLHttpRequest 对象的语法：

老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：

XMLHttpRequest对象的属性：

配置实例：

XMLHttpRequest 对象相关推荐

最新文章

热门文章