ajax请求的五个步骤?

Posted 2023-05-17

ajax请求的五个步骤：

1.建立XMLHttpRequest对象。

2.设置回调函数。

3.使用open方法与服务器建立链接。

4.向服务器发送数据。

5.在回调函数中针对不同的响应状态进行处理。

Ajax即Asynchronous javascript And XML（异步JavaScript和XML）在 2005年被Jesse James Garrett提出的新术语，用来描述一种使用现有技术集合的‘新’方法。

包括: html 或 XHTML, CSS, JavaScript, DOM, XML, XSLT, 以及最重要的XMLHttpRequest。 

使用Ajax技术网页应用能够快速地将增量更新呈现在用户界面上，而不需要重载（刷新）整个页面，这使得程序能够更快地回应用户的操作。

Ajax这个术语源自描述从基于 Web 的应用到基于数据的应用：

Ajax 不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的Web应用程序的技术。

使用 JavaScript 向服务器提出请求并处理响应而不阻塞用户核心对象XMLHttpRequest。通过这个对象，您的 JavaScript 可在不重载页面的情况与 Web 服务器交换数据，即在不需要刷新页面的情况下，就可以产生局部刷新的效果。

参考技术A ajax请求的五个步骤如下
步骤如下五个步骤
1.创建异步对象，首先，创建一个XMLHttpRequest异步对象。
2.设置请求方式和地址，然后，设置请求方式和请求地址
3.用send发送请求，接着，用send发送请求。
4.监听状态变化，然后，监听状态变化。
5.接收返回的数据，最后，接收返回的数据

一分钟学会啥是Ajax及Ajax请求的五个步骤

AJAX的意思就是异步的JavaScript和XML。简而言之，它是使用XMLHttpRequest对象与服务器端通信的脚本语言。它可以发送及接收各种格式的信息，包括JSON、XML、HTML和文本文件。AJAX最为吸引人的就是它的“异步”特性，AJAX可以无需刷新页面而与服务器端进行通信。

Ajax请求的五个步骤：

1、建立xmlHttpRequest对象

if(window.XMLHttpRequest)

xmlHttp = new XMLHttpRequest();

if(xmlHttp.overrideMimeType)

xmlHttp.overrideMimeType("text/xml");

else if(window.ActiveXobject)

var activeName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];

for(var i = 0; i < activeName.length; i++)

try

xmlHttp = new ActiveXobject(activeName[i]);

break;

catch(e)

if(!xmlHttp)

alert("创建xmlhttprequest对象失败");

else

2、设置回调函数

xmlHttp.onreadystatechange= callback;

function callback()

3、使用OPEN方法与服务器建立连接  xmlHttp.open("get","ajax?name="+ name,true)

此步注意设置http的请求方式（post/get）,如果是POST方式，注意设置请求头信息xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded")

4、向服务器端发送数据

xmlHttp.send(null)；如果是POST方式就不为空

5、在回调函数中针对不同的响应状态进行处理

if(xmlHttp.readyState == 4)       //判断交互是否成功

if(xmlHttp.status == 200)         //获取服务器返回的数据         //获取纯文本数据

var responseText =xmlHttp.responseText;

document.getElementById("info").innerHTML = responseText;

扩展资料：

Ajax优缺点

优点：

1、异步请求，不妨碍用户浏览页面或者其他操作。

2、局部刷新，无需重新刷新页面。

3、界面与应用分离。有利于分工合作、减少非技术人员对页面的修改造成的WEB应用程序错误、提高效率、也更加适用于现在的发布系统。

4、基于标准被广泛支持。

5、前端和后端负载平衡。最大程度的减少冗余请求和响应对服务器造成的负担，提升站点性能。

缺点：

1、back和History,对浏览器机制的破坏。

2、安全问题。易受到黑客攻击。

3、对搜索引擎支持较弱。

4、不能很好支持移动设备。

5、违背URL和资源定位的初衷。

参考技术A

AJAX的意思就是异步的JavaScript和XML。简而言之，它是使用XMLHttpRequest对象与服务器端通信的脚本语言。它可以发送及接收各种格式的信息，包括JSON、XML、HTML和文本文件。

Ajax请求的五个步骤：

1、建立xmlHttpRequest对象。

2、设置回调函数。

3、使用OPEN方法与服务器建立连接  xmlHttp.open("get","ajax?name="+ name,true)。

4、向服务器端发送数据。

5、在回调函数中针对不同的响应状态进行处理。

介绍

使用 JavaScript 向服务器提出请求并处理响应而不阻塞用户核心对象XMLHttpRequest。通过这个对象，您的 JavaScript 可在不重载页面的情况与 Web 服务器交换数据，即在不需要刷新页面的情况下，就可以产生局部刷新的效果。

Ajax 在浏览器与 Web 服务器之间使用异步数据传输（HTTP 请求），这样就可使网页从服务器请求少量的信息，而不是整个页面。

参考技术B 得先知道后台接口给ajax访问（接口URl和传入接口的参数及参数类型），知道访问之后返回的数据类型，有哪些数据。
选择异步请求的方式，常用的有三种，如$.ajax()、$.post()、$.get()。
其中$.ajax允许get/post两种请求方式，$.get()只允许get请求，$.post()只允许post请求方式。
异步请求所需要的常用要素：
a、url （访问url） b、dataType（数据传输方式） c、success成功之后的回调函数。
$.ajax使用示范代码（由于异步请求的参数较多，实例只是常用参数，下同）。
设接口url
var url='/test/test.do'; //下面的实例代码都用此访问接口url
$.ajax(
url:url,
dataType:'text',
success: function(data)
(请求成功之后的前端处理代码)

);
$.post使用示范代码：
$.post(url, name: "John", time: "2pm" , function(data)
alert("Data Loaded: " + data);
,'text');
$.get使用实例代码：
$.get(url, name: "John", time: "2pm" , function(data)
alert("Data Loaded: " + data);
);
看，jQuery异步请求简单吧。学会这三种方式做前后端交互基本就够用了。 参考技术C ajax请求的五个步骤如下
步骤如下五个步骤
1.创建异步对象，首先，创建一个XMLHttpRequest异步对象。
2.设置请求方式和地址，然后，设置请求方式和请求地址
3.用send发送请求，接着，用send发送请求。
4.监听状态变化，然后，监听状态变化。
5.接收返回的数据，最后，接收返回的数据 参考技术D AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。
ajax的请求步骤：
1、创建XHR对象 XMLHttpRequest（W3C标准）
2、监听XHR状态改变事件
3、创建请求消息，连接服务器
4、发送请求消息