Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[js] 第110天 请详细描述AJAX的工作原理 #1023

Open
haizhilin2013 opened this issue Aug 3, 2019 · 4 comments
Open

[js] 第110天 请详细描述AJAX的工作原理 #1023

haizhilin2013 opened this issue Aug 3, 2019 · 4 comments
Labels
js JavaScript

Comments

@haizhilin2013
Copy link
Collaborator

第110天 请详细描述AJAX的工作原理

@haizhilin2013 haizhilin2013 added the js JavaScript label Aug 3, 2019
@LinStan
Copy link

LinStan commented Aug 4, 2019

AJAX是用于网页和服务器进行异步通信的技术。
基本原理是,通过XMLHttpRequest向服务器发送异步请求,获得服务器返回的数据,利用js更新页面。
其核心功能在于XMLHttpRequest对象。
创建一个ajax的步骤大致可以分为以下几步

  • 创建XHMHttpRequest对象
  • 打开链接 (指定请求类型,需要请求数据在服务器的地址,是否异步i请求)
  • 向服务器发送请求(get类型直接发送请求,post类型需要设置请求头)
  • 接收服务器的响应数据(需根据XMLHttpRequest的readyState属性判定调用哪个回调函数)
  • 更新页面

@xxf1996
Copy link

xxf1996 commented Aug 4, 2019

@LinStan 有一点需要指正:是XMLHttpRequest对象。

@censek
Copy link

censek commented Jan 21, 2020

AJAX 是在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页。

  • 创建对象 (XMLHttpRequest 对象)
  • 请求 (将请求发送到服务器,使用 XMLHttpRequest 对象的 open() 和 send() 方法)
  • 响应 (获得来自服务器的响应,使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性)
  • readyState (onreadystatechange 事件)

@xiaoqiangz
Copy link

Ajax可以在网页和服务器之间的进行通信,从而达到不进行页面刷新的情况下让页面做到局部更新。
创建Ajax可以分如下几部分:

  1. 创建对象 XMLHttpRequest对象
  2. 发送请求至服务器,xhq有send和open方法,还可以设置请求方式为get/post。
  3. 接收服务器响应,可以监听onreadystatechange或onload事件来处理接口响应。
  4. 页面进行更新,根据接口返回更新页面对应的模块。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
js JavaScript
Projects
None yet
Development

No branches or pull requests

5 participants