2022-04-09 从ajax中xhr.open的第三个参数直观区分同步异步

本文探讨了JavaScript中的Ajax异步请求问题。在默认情况下,Ajax请求是异步的,导致在console.log中无法立即获取到响应内容。为解决此问题,可以将xhr.open的第三个参数设置为false,使请求变为同步,从而确保在控制台能正确输出PHP文件返回的'hellohellohello'。然而,同步请求会阻塞浏览器直到请求完成,可能影响用户体验。因此,在实际开发中需权衡异步与同步的使用场景。
例子
代码

js:

let str = '';
let xhr = new XMLHttpRequest();
// 监听ajax的状态
xhr.onreadystatechange = function () {
  if (xhr.readyState == 4 && xhr.status == 200) {
    str = xhr.response;
  }
}
xhr.open('get', './test.php');
xhr.send();
console.log('str', str);//结果:不能输出test.php中内容

php:

<?php
  echo "hellohellohello";
?>
结果

str没有值,也就是说没有获得xhr.response的响应信息
因为默认是异步的,此时响应信息还没有返回

解决

把xhr.open的第三个参数从true(不写默认true)改成false,xhr.open('get', './test.php',false);
也就是异步改为同步,就可以得到返回值

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端OnTheRun

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值