使用XMLHttpRequest对象

1.创建XMLHttpRequest对象，需要添加跨浏览器支持

1 if(window.XMLHttpRequest){
2                 //code for IE7+,Firefox,Chrome,Opera,Safari
3                 xmlhttp = new XMLHttpRequest();
4             }else{
5                 //code for IE6,IE5
6                 xmlhttp = new ActiveXObjext("Microsoft.XMLHTTP");
7             }

2.向服务器发送请求

1 xmlhttp.open("GET","ajax.jsp",true);
2             xmlhttp.send();

open(method,url,async)，规定请求的类型，URl以及是否异步处理请求

　　method：请求的类型；GET或POST

　　url：文件在处理器上的位置

　　async：true（异步）或false（同步）

send（String），讲请求发送到服务器

　　String：仅适用于POST请求

GET还是POST ？

　　与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。

　　然而，在以下情况中，请使用 POST 请求：

　　　　无法使用缓存文件（更新服务器上的文件或数据库);

　　　　向服务器发送大量数据（POST 没有数据量限制);

　　　　发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠。

3.XMLHttpRequest对象的常用属性

onreadystatechange属性：用于指定状态改变时所触发的事件处理器

readyState属性：用于获取请求的状态：

　　0：未初始化 1：正在加载 2：已加载 3：交互中 4：完成

responseText属性：用于获取服务器的相应，表示为字符串

responseXML属性：用于获取服务器的相应，表示为XML。这个对象可以解析为DOM对象

status属性：用于返回服务器的HTTP状态码：

　　200：表示成功 202：表示请求被接受，但尚未成功 400：错误的请求 404：文件尚未找到 500：内部服务器错误

statusText：返回HTTP状态码对应的文本，如OK或Not Found（未找到）等

script代码如下：

 1 <script type="text/javascript">
 2         function loadXMLDoc(){
 3             var xmlhttp;
 4             if(window.XMLHttpRequest){
 5                 //code for IE7+,Firefox,Chrome,Opera,Safari
 6                 xmlhttp = new XMLHttpRequest();
 7             }else{
 8                 //code for IE6,IE5
 9                 xmlhttp = new ActiveXobjext("Microsoft.XMLHTTP");
10             }
11             xmlhttp.onreadystatechange = function(){
12                 if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
13                     document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
14                 }
15             }
16             xmlhttp.open("GET","ajax.jsp",true);
17             xmlhttp.send();
18         }
19     </script>

body代码如下：

1 <body>
2     <h4>AjaxDemo</h4>
3     <button type="button" onclick="loadXMLDoc()">请求数据</button>
4     <div ></div>
5   </body>

使用XMLHttpRequest对象

相关推荐