ajax 基本知识

最新推荐文章于 2022-08-12 09:54:19 发布

rj1bww

最新推荐文章于 2022-08-12 09:54:19 发布

阅读量348

点赞数

分类专栏： ajax 文章标签： ajax

本文链接：https://blog.csdn.net/rj1bww/article/details/71308135

版权

ajax 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

在ajax中有个非常成重要的对象:XMLHttpRequest

完成ajax需要javascript支持

这个对象有以下主要的方法和属性：
方法：
abort() ----------------->取消当前所发出的请求
open ---------------->创建请求 ,示例：open("post","路径") 这个方法的post指的是提交的方式，可以取 post,get等提交方式
send()--------------->发送请求示例：send(null);这个send()方法的参数一般都是null
getAllResponseHeaders(); ---->取得所有的http头信息
getResponseHeader();----->取的指定的http头信息
setRequestHeader()--------->设置一个指定请求的的http头信息

属性：

readyState:返回当前请求的状态，只读

onreadystatechange:指定当readyState改变时使用的操作，一般是指定回调函数

responseText------->以文本的形式去的回应数据，只读
responseStream------->以Ado Stream 对象的形式去的回应数据，只读
responseBody------->以回应数据正文以unsigned byte 数组形式返回，只读
responseXML------->以xml文档的形式去的回应数据，只读
status---------->返回当前请求的http状态码，只读
statusText--------->返回当前请求的的响应行状态，只读

其中readyState取值由5种取值：

0：请求还没有建立，（open()方法调用之前）

1：请求已经建立，但还没有发出（send()方法调用之前）

2：请求已经发出正在处理当中

3：请求已经处理，正在接收服务器信息，相应通常部分数据可用，但服务器还没有完全响应

4:响应已经完成

代码示例：

下面给出一个简单示例：

一.ajaxdemo.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script>
window.οnlοad=function(){
document.getElementById("btn").addEventListener("click",function(){
showInfo();
},false);
}
var xmlHttp;
function createXMLHttp(){ //此方法的作用是创建XMLHttpRequest对象
if(window.XMLHttpRequest){ //非IE浏览器可以直接实例化XMLHttpRequest对象
xmlHttp=new XMLHttpRequest();
}else{ //如果是IE浏览器，则通过new ActiveXObject()创建对象
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
function showInfo(){
createXMLHttp(); //创建XMLHttpRequest对象
xmlHttp.open("post","info.html"); //创建请求
xmlHttp.onreadystatechange=showInfoBack; //指定回调函数为showInfoBack()方法
xmlHttp.send(null);//发送请求
}
function showInfoBack(){
if(xmlHttp.readyState==4&&xmlHttp.status==200){
var info=xmlHttp.responseText;//以普通文本的形式返回服务器响应
document.getElementById("info").innerHTML=info;
}
}
</script>
</head>
<body>
<input type="button" value="显示文本" id="btn"/>
<span id="info"></span>
</body>
</html>

二.info.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
Hello World!!
</body>
</html>

以上就是ajax的基本讲解，本人小白一个，如果有错误请指正。

rj1bww

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax 基本知识

在ajax中有个非常成重要的对象:XMLHttpRequest完成ajax需要javascript支持这个对象有以下主要的方法和属性：方法：abort() ----------------->取消当前所发出的请求open ---------------->创建请求 ,示例：open("post","路径") 这个方法的post指的是提交的方式，可以取 post,get等提交方式
复制链接

扫一扫