php ajax异步加载_Ajax 异步加载解析

这篇文章主要为大家详细介绍了Ajax 异步加载,什么是Ajax 异步加载,如何实现Ajax 异步加载,感兴趣的小伙伴们可以参考一下

AJAX (Asynchronous JavaScript and XML,异步的 JavaScript 和 XML)。它不是新的编程语言,而是一种使用现有标准的新方法,是在不重新加载整个页面的情况下与服务器交换数据并更新部分网页的艺术。

那么,让我们一起走进AJax的世界吧。

基础语法

学习Ajax之前,我们要明确自己的需求,那就是在不刷新页面的前提下实现异步的与服务器进行交互,更新页面信息。使用Ajax其实也是很简单的,我们只需要遵循一定的步骤即可。

•创建Ajax对象(原生的需要判断当前浏览器的类型)

•设置回调函数 (完成与服务器的交互之后所触发的函数)

•打开请求,并发送。(根据请求方式的不同,代码书写稍有不同)

•客户端获得反馈数据,更新页面

获取Ajax对象

不同的浏览器对Ajax的支持是不一致的,所以我们要区别的对待。

c998d64d75e8d1a36bf658946ce2a501.png

设置回调函数

设置回调函数的目的就是在Ajax完成与服务器的交互之后,将获取到的数据信息,添加到页面上。

通常我们会指定onreadystatechange函数作为我们的回调处理函数。

相关于Ajax与服务器交互有如下状态信息供我们在编码的过程找中参考。

.readystate

关于加载状态有如下几个常用的数值:

•0: 请求未初始化

•1: 服务器连接已建立

•2: 请求已接收

•3: 请求处理中

•4: 请求已完成,且响应已就绪

.status

加载结果的状态信息有:

•200: “OK”

•404: “未找到此页面”

开启交互

一谈起交互,映入脑海的就是双方。也就是我们的ajax客户端和服务器之间的交互。所以我们需要明确请求数据在服务器上的位置

open(method,url,async)

url的使用会根据method的不同而不同,这一点我们务必要清楚。至于asynchronous这个参数,一般来说对于数据量很小的请求可以采用false,但是建议使用true来进行异步的加载,来避免服务器压力过大。

•GET方式

只是用这种方式很简单,指定url在服务器上的位置即可。这里红色部分的理解相当的重要。我们务必指定url为请求在服务器上的位置,一般采用绝对路径的方式。

// 对Servlet来说指定其注解上的位置即可

xmlhttp.open("GET","/Test/servlet/AjaxServlet?userinput="+str.value,true);

xmlhttp.send();

•POST方式

使用POST方式的时候,我们需要额外的多一项处理。如下例:

xmlhttp.open("POST","ajax_test.asp",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

// 在send方法中指

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值