经历长期痛苦以及短暂的快乐之后,终于到达了AJAX。。看完视频之后发现之前学的JS居然是老掉牙的玩意儿,我也是醉啦,但到了AJAX这里反而就成了不可或缺的部分,呵呵。。
背景
JS是一种脚本语言,它的出现使得网页和用户之间实现了一种实时的、动态的和交互的关系,使网页包含更多活跃的元素和更多精彩的内容。
但是JS存在3个弊端,即复杂的DOM,不一致的浏览器实现和缺乏便捷的开发、调试工具。
正当JS从开发者的视线中渐渐隐去时,一种新型的基于JS的web技术——AJAX(异步的JS和XML)诞生了。从而互联网中基于JS的应用越来越多,使它不再是一种仅仅用于制作web页面的简单脚本。
定义
AJAX是一些“古老”技术的融合,比如JS、XML、DOM、CSS等。只要开发B/S架构的应用,那么表现层就一定会使用ajax技术。在出现AJAX之前,web浏览器都是同步的,自从有了它之后,就进入了异步的时代!这样一来,咱们就可以在不重载整个浏览器页面的前提进行局部的刷新,大大加强了用户的体验度。
优势
AJAX应用本质上是一种RIA。AJAX的优势非常明显:
1、基于AJAX的应用无须浏览器下载任何插件,并可以在任何平台上良好运行。
2、所用的技术很古老。对于开发人员而言,相比于选择新的技术,如ClickOnce等,他们将更乐意选择已经熟悉的技术。同时,这些技术都是标准的,几乎所有浏览器都对ajax技术支持良好。
作用
AJAX采用异步方式发送请求,避免每个请求对应一个页面的模式,允许在一个页面发送多个请求,从而可以更大程度的利用已下载的页面,服务器每次响应生成的只是必需的数据,无需响应整个页面。
对用户而言,发送异步请求不会阻塞当前的浏览器线程,浏览器可以继续下一步操作,比如继续浏览或再次发送异步请求。因此用户将不会处于等待状态,而是感觉自己一直与应用处于交互状态,从而带给了用户连续的体验。
核心
ajax的核心是JS对象XMLHttpRequest。该对象提供了异步发送请求的能力。它可以通过JS向服务器发送请求,处理服务器响应,避免阻塞用户动作。这样一来,浏览器通过客户端脚本与服务器交换数据,而web页面无须重新加载,内容也由客户端脚本动态更新。
XMLHttpRequest提供的异步,是指基于ajax的应用在服务器中的通信方式。
传统的web应用,每次用户向服务器请求获得新数据时,浏览器都会丢弃当前页面,而等待重新加载新的页面。这样一来,在服务器完全响应之前,用户浏览器将一片空白,用户的动作必须中断。
而异步指用户发送请求后,完全无需等待,请求会在后台发送,不会阻塞用户当前活动。这样一来,用户无须等待第一次请求得到完全响应,就可以发送第二次请求。
工作流程
AJAX使用JS来回传数据,XMLHttpRequest是ajax的核心,JS则是ajax技术的粘合剂。整个过程如下:
1、JS脚本使用XMLHttpRequest对象向服务器发送请求。发送请求时,既可以发送GET请求,也可以发送POST请求
2、JS脚本使用XMLHttpRequest对象解析服务器响应数据
3、JS脚本通过DOM动态更新HTML页面。也可以为服务器响应数据增加CSS样式表,在当前网页的某个部分加以显示。
总结
咱们通过在浏览器和服务器之间添加ajax中间层,允许浏览器异步发送请求,同时允许动态加载服务器响应。在服务器响应完成后,JS通过DOM动态更新HTML页面,从而避免了丢弃当前页面。自始至终,用户的动作无须中断,所感受的是一种连续的体验。