• 软件:1711
  • 资讯:45336|
  • 收录网站:98302|

IT精英团

js系列41 :Ajax

js系列41 :Ajax

浏览次数:
评论次数:
编辑: 乐咏
信息来源: 51CTO博客
更新日期: 2021-07-22 12:19:33
摘要

js系列四十一:Ajax,Ajax是网页与服务端进行数据交互的一种技术.我们可以通过服务端提供接口,用Ajax向服务端请求我们需要的数据,整个过程的简单实现如下所示.//简单的Ajax原生实现//由服务端提供接口varurl="https://baidu.com/";varresult;varXHR=newXMLHttpResquest();XHR.open('GET',url,true...

  • 资讯详情

Ajax是网页和服务器之间的数据交互技术。我们可以通过服务器提供接口,并使用Ajax向服务器请求我们需要的数据。整个过程的简单实现如下。

//简单的Ajax本机实现

//服务器提供的接口

var URL=' https://Baidu.com/';

var结果;

var XHR=new XMLHttpResquest();

XHR.open('GET ',url,true);

xhr . send();

xhr . onreadystatechange=function(){ 0

if(XHR . ready state==4 XHR . status==200){ 0

结果=XHR.response

console.log(结果);

}

}

在Ajax的本机实现中,使用onreadystatechange事件。只有当事件被触发并满足一定条件时,我们才能得到我们想要的数据,然后对数据进行处理。

这看起来不像什么,但是如果此时需要发出另一个Ajax请求,那么这个新的Ajax请求中的一个参数必须从以前的Ajax请求中获得。这时,我们必须这样做

//简单的Ajax本机实现

//服务器提供的接口

var URL=' https://Baidu.com/';

var结果;

var XHR=new XMLHttpResquest();

XHR.open('GET ',url,true);

xhr . send();

xhr . onreadystatechange=function(){ 0

if(XHR . ready state==4 XHR . status==200){ 0

结果=XHR.response

console.log(结果);

//伪码约为:如下

var url2=' .';

var xhr 2=new XMLHttpResquest();

xhr 2 . open();

xhr 2 . send();

.

}

}

当有了第三个Ajax,它会变得越来越麻烦,它会产生我们所说的回调地狱

js系列四十五:异常处理
« 上一篇
返回列表
下一篇 »
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表
你会是第一个来这里评论的人吗?
最近发布资讯
更多