关于ajax中的onreadystatechange

最新推荐文章于 2024-05-28 11:25:27 发布
最新推荐文章于 2024-05-28 11:25:27 发布
阅读量1.2k 收藏
点赞数
分类专栏： 技术篇
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/scwMason/article/details/82146151
版权

先铺垫一下知识：

readystate 属性存有 XMLHttpRequest 的状态信息，也就是代表着请求数据的过程，是由0~4代表，具体见（onreadystatechange）

status：跟readystate一起变化的属性，200表示成功，404表示未找到页面，还有很多其他的值表示不同的问题

只要readystate变化，就会触发onreadystatechange方法

我们先看一个例子：

<html>

<head>

    <script type="text/javascript">  
        function loadXMLDOC(url,cfunc) {
            if (window.XMLHttpRequest) {
                xmlhttp = new XMLHttpRequest();
            }
            else {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=cfunc;
            xmlhttp.open("GET",url,true);
            xmlhttp.send();
        }
        function parseXML() {
           loadXMLDOC("demo.txt",function(){
               console.log(xmlhttp.status);
               if(xmlhttp.readyState==4&&xmlhttp.status==0){
                xmlDoc = xmlhttp.responseText;
                console.log(xmlDoc);
                document.getElementsByTagName("div")[0].innerHTML=xmlDoc;
               }
           });
        }  
    </script>
</head>

<body onload="parseXML()">
    <h1>W3School.com.cn Internal Note</h1>
    <div style="width: 100px;height: 100px;"></div>
    <button type="button" onclick="parseXML()">la</button>
</body>

</html>

所以我们这个例子中的onreadystatechange需要赋值一个函数，为什么我们的判断语句里面是写着status==0而不是200呢，因为：

如果在本地运行(如：C:\\ajax\\ helloworld.htm)，那么status属性不管是在”成功”还是”页面未找到”的情况下，都返回的是0。
也就是说没有通过Web服务器形式的Ajax请求返回值都是0;

也就是我们的demo.txt是本地文件，ajax请求根本就没有通过服务器，所以status的值只能是0

并且我们在这个例子中封装了一个loadeXMLDOC方法，里面的参数可以更好的实现ajax请求

scwMason
关注
专栏目录
菜鸟：AJAX - onreadystatechange 事件!!!（附服务器少见的状态码）
王大师企业官方博客
08-19 441
AJAX - onreadystatechange 事件 onreadystatechange 事件 当请求被发送到服务器时，我们需要执行一些基于响应的任务。 每当 readyState 改变时，就会触发 onreadystatechange 事件。 readyState 属性存有 XMLHttpRequest 的状态信息。 下面是 XMLHttpRequest 对象的三个重要的属性： 属性 描述 onreadystatechange 存储函数（或函数名），每当 readyState 属性改变时，就会调用该
AJAX – onreadystatechange 事件
12-14
在 AJAX 中，`onreadystatechange` 事件扮演了关键角色，它使得开发者能够根据请求的状态来执行相应的处理。 `onreadystatechange` 事件是一个事件处理器，每当 `XMLHttpRequest` 对象的 `readyState` 属性发生变化...
Ajax里的onreadystatechange的作用是什么
Loger
03-09 1465
  发送一个请求后，客户端无法确定什么时候会完成这个请求，所以需要用事件机制来捕获请求的状态，XMLHttpRequest对象提供了onreadyStateChange事件实现这一功能。这类似于回调函数的做法。onreadyStateChange事件可指定一个事件处理函数来处理XMLHttpRequest对象的执行结果，如：ajaxObj=createAjaxObject(); var u
Ajax里的onreadystatechange的作用
diligentcat的专栏
04-03 610
Ajax里的onreadystatechange的作用2009-03-15    文章来源：    浏览次数：3302发送一个请求后，客户端无法确定什么时候会完成这个请求，所以需要用事件机制来捕获请求的状态，XMLHttpRequest对象提供了onreadyStateChange事件实现这一功能。这类似于回调函数的做法。 onreadyStateChange事件可指定一个事件
Ajax onreadystatechange
tooytoos的博客
01-07 481
出错
AJAX —— onreadystatechange 事件
Hern（宋兆恒）
08-22 1148
当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当 readyState 改变时，就会触发 onreadystatechange 事件。 readyState 属性存有 XMLHttpRequest 的状态信息。下面是 XMLHttpRequest 对象的三个重要的属性： 属性 描述 onreadystatechange 存储函数（或函数名），每当 readyStat...
Ajax 给 XMLHttpReq.onreadystatechange传递参数
10-25
在JavaScript和Web开发中，Ajax（Asynchronous JavaScript and XML）是一种技术，用于在不刷新整个网页的情况下更新页面的特定部分。Ajax的核心是XMLHttpRequest对象，它允许与服务器进行异步数据交换。`...
firefox下对ajax的onreadystatechange的支持情况分析
09-05
在Firefox浏览器中，AJAX（异步JavaScript和XML）的`onreadystatechange`事件处理与Internet Explorer（IE）存在一些差异，这些差异可能会导致在处理服务器响应时遇到问题。`onreadystatechange`是AJAX请求的核心...
WEB开发 之 AJAX - onreadystatechange 事件.docx
09-26
`onreadystatechange`事件是AJAX中的关键部分，它使得开发者能够在XMLHttpRequest对象的状态发生变化时执行相应的处理程序。 XMLHttpRequest对象是AJAX的核心，它提供了与服务器进行通信的能力。`...
【AJAX】AJAX - onreadystatechange 事件
Homer
12-11 367
AJAX - onreadystatechange 事件 onreadystatechange 事件 当请求被发送到服务器时，我们需要执行一些基于响应的任务。 每当 readyState 改变时，就会触发 onreadystatechange 事件。 readyState 属性存有 XMLHttpRequest 的状态信息。 下面是 XMLHttpRequest
onreadystatechange
qizhanfeng的专栏
06-16 332
这两天，正在给部门的一个项目做优化，其中一项是将web应用中的所有alert用div方式实现，javascript的相关方法都写好了，方法名为showDialog，前台页面调用showDialog方法一点也没有问题，可是页面一旦提交，从后台输出脚本，调用showDialog方法，就会时不时的出现问题了，报一个无法打开Internet站点的错误，在脚本中下断点调试，依然找不到问题的根源，最...
[JavaScript][AJAX]onreadystatechange事件；AJAX含义及组成部分；AJAX工作原理/HTTP工作原理；一个页面从输入url到呈现网页过程；FormData对象；防抖
wusandaofwy的博客
08-28 1574
onreadystatechange事件 AJAX含义及组成部分 AJAX工作原理/HTTP工作原理 一个页面从输入url到呈现网页过程 TCP三次握手图示 渲染引擎渲染网页流程图​编辑 FormData对象 防抖与节流 防抖 节流 防抖和节流的异同点...
ajax下onreadystatechange写法
sinat_20625509的专栏
03-23 469
之前试过这种写法发现一直不响应 xmlhttp.onreadystatechange=function(){ if(xmlhttp.readyState==4 && xmlhttp.status==200){ msg=xmlhttp.responseText; } 解答是：在调用函数的时候不能带任何参数，使用()都不行! 拆分开，也就是=后
AJAX - onreadystatechange 事件 readyState属性 status属性使用逻辑
最新发布
CheneyChen27的博客
05-28 339
事件用于在的readyState属性发生变化时执行某些操作。你通常会在这个事件处理器中检查readyState是否为4（即请求已完成），然后进一步检查status属性以确定请求是否成功。status属性用于获取服务器响应的 HTTP 状态码。你应该在readyState为4时检查它。一句话：先看你的请求(readyState)是否正常，再看你请求服务端响应(status)是否正常，然后进行你的业务操作...。
ajax onreadystateChange 个人 图解
weixin_43168278的博客
04-01 222
[AJAX系列]onreadystatechange事件
weixin_34150830的博客
09-17 101
onreadystatechange事件： 当请求被发送到服务器时，我们需要执行一些基于响应的任务 每当readyState改变时，就会触发onreadystatechange事件 readyState属性存有XMLHttpRequest的状态信息 XMLHttpRequest对象的三个重要的属性： 属性 描述 onreadystatechange 存储函数（函...
对ajax中onreadystatechange事件执行流程的理解
weixin_43719752的博客
11-13 978
对Ajax中onreadystatechange事件执行流程的理解 onreadystatechange 事件 当请求被发送到服务器时，我们需要执行一些基于响应的任务。 每当 readyState 改变时，就会触发 onreadystatechange 事件。 readyState 属性存有 XMLHttpRequest 的状态信息。 下面是 XMLHttpRequest 对象的三个重要的属性： 属性 描述 onreadystatechange 存储函数（或函数名），每当 readyStat
ajax onload
08-22
AJAX (Asynchronous JavaScript and XML) 是一种在网页中进行异步数据交互的技术。当使用 AJAX 发送请求并接收到响应时，我们可以利用 `onload` 事件来处理返回的数据。 `onload` 是一个事件处理函数，它在 AJAX 请求成功完成并且返回数据时触发。我们可以通过指定一个函数来处理这个事件，以便在数据加载完成后执行相应的操作。 以下是一个简单的示例代码，展示了如何使用 `onload` 处理 AJAX 请求的返回数据： ```javascript // 创建 XMLHttpRequest 对象 var xhr = new XMLHttpRequest(); // 监听 onload 事件 xhr.onload = function() { if (xhr.status >= 200 && xhr.status < 400) { // 请求成功 var response = xhr.responseText; // 获取返回的数据 // 执行相应的操作，比如更新页面内容 console.log(response); } else { // 请求失败 console.error('请求失败！'); } }; // 发送 AJAX 请求 xhr.open('GET', 'example.com/data', true); xhr.send(); ``` 在上面的示例中，我们创建了一个 `XMLHttpRequest` 对象并指定了 `onload` 事件处理函数。当 AJAX 请求成功返回时，`onload` 函数会被触发，我们可以在其中获取返回的数据并执行相应的操作。请注意，我们需要使用 `open` 方法指定请求的方法、URL 和是否异步发送请求，并使用 `send` 方法发送请求。 这只是一个简单的示例，实际使用中可能需要根据具体需求进行更多的处理和错误处理。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值