ajax局部刷新

最新推荐文章于 2025-02-23 16:00:24 发布

陌路学java

最新推荐文章于 2025-02-23 16:00:24 发布

阅读量2.1k

点赞数

文章标签： java

本文链接：https://blog.youkuaiyun.com/molu1991/article/details/124201797

版权

Ajax是一种用于实现网页局部刷新的技术，其核心是XMLHttpRequest异步对象。创建XMLHttpRequest对象后，通过设置open()和send()方法发送请求。当readyState变为4且status为200时，表明请求成功，可以通过responseText属性获取数据。通过onreadystatechange事件监听状态变化，从而更新页面内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ajax是用来做局部刷新的。

局部刷新使用的核心对象是异步对象（XMLHttpRequest）
这个异步对象是存在浏览器内存中的，使用javascript语法创建和使用XMLHttpRequest对象。

创建 XMLHttpRequest 对象的语法（xhr）：

var xmlhttp=new XMLHttpRequest();

通过判断 XMLHttpReqeust 对象的状态，获取服务端返回的数据。

语法：
xmlHttp.onreadystatechange= function() {
//当xmlHttp.readyState == 4的时候，表示我们可以处理数据了
//当xmlHttp.status == 200 的时候，表示我们的网络请求时成功了
if( xmlHttp.readyState == 4 && xmlHttp.status == 200){
     //获取服务器返回的数据
     var data = xmlHttp.responseText;
          //更新数据
        document.getElementById("name").value= data; 
 }
}

readyState 属性：表示异步对象请求XMLHttpRequest 的状态。从 0 到 4 发生变化。

• 0: 请求未初始化，创建异步请求对象 var xmlHttp = new XMLHttpRequest();

• 1: 初始化异步请求对象， xmlHttp.open(请求方式，请求地址，true);

• 2: 异步对象发送请求， xmlHttp.send();

• 3: 异步对象接收应答数据从服务端返回数据。是XMLHttpRequest异步对象内部处理使用。

• 4: (常用)异步请求对象已经将数据解析完毕。此时才可以读取数据。由开发人员处理并更新当前页面。

异步对象的status属性，表示网络请求的状况的， 200， 404， 500，需要是当status==200
时，表示网络请求是成功的。

例如：xmlHttp.open("get", "loginServlet?name=zs&pwd=123",true);

使用异步对象发送请求：xmlHttp.send();

获取服务器端返回的数据，使用异步对象的属性 responseText

使用例子：
//获取服务器返回的数据
     var data = xmlHttp.responseText;

回调：当请求的状态变化时，异步对象会自动调用onreadystatechange事件对应的函数。