AJAX学习笔记（二）——同步和异步

最新推荐文章于 2024-09-02 17:44:21 发布
最新推荐文章于 2024-09-02 17:44:21 发布
阅读量502 收藏
点赞数
分类专栏： AJAX 文章标签： ajax 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tmqueen/article/details/50540678
版权

  在AJAX出现之前，浏览器和服务器之间采用的是同步的方式，即俺们辛苦填完表单，点击提交，等待服务器响应过程中，不能进行表单的相关操作。可能等了会有响应了，提示你邮箱格式不对，重新填写，再提交，再等；啊哦，又提示你两次输入的密码不一致，重新填写，再提交，再等。。。心好累啊~

  然后有人说，现在我在注册信息的时候，并不是提交后提示邮箱错误或者密码错误，我一填写完，就有提示信息蹦出来呀~好吧，那是因为用到阿贾克斯了咩~这就是浏览器和服务器之间采用异步方式了。此时，并不是全部表单提交后，进行响应，而是在填写过程中，部分内容与服务器进行响应，此时我们仍然可以填写其他表单项。

  那么为什么以前没有这么智能呢？因为没有出现XMLHttpRequest对象呀，它呢建立起了异步的桥梁。下一节里，我再来看看XMLHttpRequest对象到底是啥，到底难不难吧~大笑



爱吃番茄的西红柿
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何快速入门Ajax（学习笔记）—— 原生ajax、jQuery、axios
m0_67402096的博客
03-06 384
如何快速入门Ajax 1. 服务器的基本概念 客户端与服务器 URL地址 网页中如何请求数据 资源的请求方式 2. 了解Ajax Ajax是什么 Ajax的应用场景 3. jQuery中的Ajax get() post() ajax() 接口 4. form表单的基本使用 组成部分 属性 action target method enctype 表单的同步提交 缺点 解决方案 serialize() 函数 5. 原生Ajax XMLHttpRequest
JavaScript(18) - Ajax上,同步请求,异步请求,HTTP协议
weixin_46106512的博客
04-13 1475
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录一、Ajax介绍1, Ajax的概念2, Ajax的作用3, Ajax的优势4, Ajax相关的概念5, Ajax的核心6, 创建XHR对象7, XMLHttpRequest对象的属性和方法二、同步请求三、异步请求四、HTTP协议 提示：以下是本篇文章正文内容，下面案例可供参考 一、Ajax介绍 1, Ajax的概念 AJAX (阿贾克斯 Asynchronous Javascript And Xml ) 异步JavaSc.
js的异步运行机制
weixin_34404393的博客
08-29 101
来自：https://www.cnblogs.com/heshan1992/p/6650593.html JS中的异步运行机制如下: （关键字：主线程、执行栈，任务队列、事件、异步任务） 1 2 3 4 （1）所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。 （2）主线程之外，还存在一个"任务队列"...
JS-----------Ajax
每天都要努力学习哦~~
11-18 990
传统网站存在的问题 网速慢点情况下,页面加载时间长,用户只能等待 表单提交后,如果一项内容不合格,需要重新填写所有的表单内容 页面跳转,重新加载页面,造成资源浪费,增加用户等待时间 ajax概述 阿贾克斯 Ajax 它本身不是一种技术 Ajax是利用JavaScript脚本改变web应用与服务器端之间数据交互的一种方式（异步加载页面）。 通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 传统的网页（不使用
阿贾克斯（Ajax）异步请求数据
weixin_30267785的博客
05-04 3347
js文件中： 1.接受数据，分割拼接处理 2.var xhr = XMLHTTPRequest（） 3.判断请求类型，get or post；get 的url里有参数，post里边没有（不能被用户直接看到）；里边都要写xhr.open();xhr.send()，post请求的话还要写xhr.setRequestHeader(). 4.判断readystate变化到4，说明请求数据结束；判断...
Ajax异步操作集合啦（阿贾克斯）
weixin_30411819的博客
07-15 371
/** Ajax的核心操作对象是xmlHttpRequest* 　　 简化操作步骤：实例化一个xmlHttpRequest对象 ==> 发送请求 ==> 接受响应 ==> 执行回调*/ 实例化对象 　　考虑到兼容问题,非IE5/IE6 使用 => new XMLHttpRequest(); 　　IE5/IE6使用 =>new Acti...
AJAX学习笔记——AJAX的异步与同步
weixin_62117675的博客
11-12 308
AJAX学习笔记——AJAX的异步与同步 （大多是情况下使用异步，只有在极个别的情况下使用同步）
AJAX学习笔记——引入与概述
weixin_62117675的博客
11-08 318
AJAX是如何引入的，Ajax的概括。以及AJAX的异步请求的理解 均是观看老杜视频所记的笔记。希望能对xdm有所帮助。若有补充，还希望大家不要吝啬自己的才华。写在评论区里。
JavaScript系列学习笔记 —— Ajax异步刷新技术
LaoYe的博客
03-13 856
目录 一、概念详解 Ajax的概念、定义、原理、原则、最常使用的场景和需要注意的几个问题这六方面的介绍 二、Ajax的核心XMLHttpRequest对象 2.1初始化XMLHttpRequest对象 2.2 XMLHttpRequest对象...
前端学习笔记——Ajax
lxy95512的博客
03-10 1323
URL地址 URL地址的概念 URL (全称是UniformResourcel ocator)中文叫统一资源定位符, 用于标识互联网上每个资源的唯一存放位置，浏览器只有通过URL地址,才能正确定位资源的存放位置,从而成功访问到对应的资源。 URL地址的组成部分 URL地址一般由三部组成: ①客户端与服务器之间的通信协议 ②存有该资源的服务器名称 ③资源在服务器上具体的存放位置 客户端与服务器的通信过程 客户端与服务器之间的通信过程,分为请求-处理-响应三个步骤。 如果要在网页中请
AJAX——异步处理技术
LJW123487的博客
05-15 1076
AJAX学习笔记
Ajax学习笔记
cjhxydream的博客
04-07 1262
文章目录全局刷新和局部刷新01 全局刷新02 局部刷新局部刷新特点Ajax概念Ajax异步实现步骤step 01 创建异步对象step 02 给异步对象绑定事件step 03 初始异步请求对象step 04 使用异步对象发送请求step 补充说明原生XMLHttpRequest实现异步请求jQuery中的Ajax请求$.ajax方法$.get方法和post方法表单序列化serialize() 全局刷新和局部刷新 01 全局刷新 整个浏览器被新的数据覆盖，在网络中传输大量的数据，浏览器需要加载，渲染页面 02
【学习笔记】前端（I）—— Vue2（Ⅰ）
Eddie_hyh的博客
04-30 794
前端第一部分：Vue（Ⅰ）
Ajax 详解 网页从输入url到渲染的流程 同步 异步 你想要的全都有
weixin_57320268的博客
03-18 1121
#1 前后端交互流程 了解服务器 了解前端 了解什么是ajax 前后端交互的三个流程 提供某种服务器的机器(计算机) ##了解前端 访问 服务器的几种方式 直接在地址栏输入网址 网页会跳转 全局刷新 a标签的herf属性 网页会跳转 全局刷新 location.herf= 'url' 网页会跳转 ...
AJAX基础与进阶
最新发布
2301_80441013的博客
09-02 512
js代码修改之后，需要重新调用后台，Ctrl C关闭之前端口，重新启用新端口。注意：send（ ）只能接受字符串类型，想要传递对象等其他类型，则必须进行转换。在 url 后面缀参数，用 问号 分隔，多个参数之间用 & 分隔。1. 黄框中的响应头，可以设置任意的响应头，自定义的也可以。2. 红框中，将对象转变成字符串，使得send可以传递对象。好啦~本次的分享到这里就结束啦~~~我们下次不见不散~~~回到原来终端，在用node 文件名，实现运行。注意：这三个文件都要有，一个没有都不可以。
前端的面试题
本人小可爱
08-30 580
【代码】前端的面试题。
跨页面进行数据通讯
榴莲不好吃的专栏
09-02 256
Broadcast Channel API 允许在一个源的不同窗口、标签页或 iframe 之间进行通信。这是一种实时的通信机制，非常适合需要实时同步数据的场景。3.iframe 数据通讯 postMessage/message（可设置不同源数据通讯）1.使用 LocalStorage 或 SessionStorage（同源）// 检查消息来源，确保来自正确的源。// 检查消息来源，确保来自正确的源。'Hello 来自父亲的消息!'Hello 来自儿子的消息!// 忽略来自自身的消息。
vue3+vite 通过js引入的src，在打包后为什么不能显示
肖肖肖丽珠的博客
09-02 109
页面有个图片我是动态设置的。但是打包之后一直没有找到。我本来使用的绝对定位发现不行，改成了相对的也不行，最后改成下面的这种就可以啦。
js ajax同步和异步
09-05
JavaScript中的AJAX请求可以使用同步（Synchronous）或异步（Asynchronous）方式发送。下面是它们的区别： 1. 同步（Synchronous）AJAX请求：在发送AJAX请求后，代码会一直等待服务器响应，直到收到响应或超时。这意味着在接收到响应之前，代码会被阻塞，并且页面的其他操作会被延迟执行。同步请求一般是通过设置`async`参数为`false`来实现。 示例： ```javascript var xhr = new XMLHttpRequest(); xhr.open('GET', 'example.com/api', false); xhr.send(); console.log(xhr.responseText); // 等待服务器响应后输出响应内容 ``` 2. 异步（Asynchronous）AJAX请求：在发送AJAX请求后，代码会继续执行而不会等待服务器响应。当服务器返回响应时，会触发一个回调函数进行处理。这种方式不会阻塞页面的其他操作，可以提高用户体验。异步请求是默认的AJAX行为。 示例： ```javascript var xhr = new XMLHttpRequest(); xhr.open('GET', 'example.com/api', true); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { console.log(xhr.responseText); // 在收到响应后输出响应内容 } }; xhr.send(); ``` 请注意，使用异步AJAX请求时，需要通过回调函数来处理响应。在回调函数中执行相应的操作。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值