广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >什么是AJAX开发
  • 313
分享到

什么是AJAX开发

2024-04-02 19:04:59 313人浏览 泡泡鱼
摘要

本篇内容介绍了“什么是ajax开发”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

本篇内容介绍了“什么是ajax开发”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

在使用浏览器浏览网页的时候,当页面刷新很慢的时候,你的浏览器在干什么?你的屏幕内容是什么?是的,你的浏览器在等待刷新,而你的屏幕内容是一片空白,而你在屏幕前苦苦的等待浏览器的响应。开发人员为了克服这种尴尬的局面,不得不在每一个可能需要长时间等待响应的页面上增加一个DIV,告诉用户“系统正在处理您的请求,请稍候……”。

  现在,有一种越来越流行越热的“老”技术,可以彻底改变这种窘迫的局面。那就是AJAX。如今,随着Gmail、Google-maps的应用和各种浏览器的支持,AJAX正逐渐吸引全世界的眼球。

一、AJAX定义
   AJAX(Asynchronous javascript and XML)其实是多种技术的综合,包括Javascript、XhtmlCSS、DOM、XML和XSTL、XMLHttpRequest。其中:

  使用XHTML和CSS标准化呈现,使用DOM实现动态显示和交互,使用XML和XSTL进行数据交换与处理,使用XMLHttpRequest对象进行异步数据读取,使用Javascript绑定和处理所有数据。

  在AJAX提出之前,业界对于上述技术都只是单独的使用,没有综合使用,也是由于之前的技术需求所决定的。随着应用的广泛,AJAX也成为香饽饽了。

二、现状与需要解决的问题
  传统的WEB应用采用同步交互过程,这种情况下,用户首先向HTTP服务器触发一个行为或请求的呼求。反过来,服务器执行某些任务,再向发出请求的用户返回一个HTML页面。这是一种不连贯的用户体验,服务器在处理请求的时候,用户多数时间处于等待的状态,屏幕内容也是一片空白。如下图:

什么是AJAX开发

什么是AJAX开发

  自从采用超文本作为Web传输和呈现之后,我们都是采用这么一套传输方式。当负载比较小的时候,这并不会体现出有什么不妥。可是当负载比较大,响应时间要很长,1分钟、2分钟……数分钟的时候,这种等待就不可忍受了。严重的,超过响应时间,服务器干脆告诉你页面不可用。另外,某些时候,我只是想改变页面一小部分的数据,那为什么我必须重新加载整个页面呢?!当软件设计越来越讲究人性化的时候,这么糟糕的用户体验简直与这种原则背道而驰。为什么老是要让用户等待服务器取数据呢?至少,我们应该减少用户等待的时间。现在,除了程序设计、编码优化和服务器调优之外,还可以采用AJAX。

三、为什么使用AJAX
  与传统的Web应用不同,AJAX采用异步交互过程。AJAX在用户与服务器之间引入一个中间媒介,从而消除了网络交互过程中的处理—等待—处理—等待缺点。用户的浏览器在执行任务时即装载了AJAX引擎。AJAX引擎用JavaScript语言编写,通常藏在一个隐藏的框架中。它负责编译用户界面及与服务器之间的交互。AJAX引擎允许用户与应用软件之间的交互过程异步进行,独立于用户与网络服务器间的交流。现在,可以用Javascript调用AJAX引擎来代替产生一个HTTP的用户动作,内存中的数据编辑、页面导航、数据校验这些不需要重新载入整个页面的需求可以交给AJAX来执行。

什么是AJAX开发

什么是AJAX开发

  使用AJAX,可以为ISP、开发人员、终端用户带来可见的便捷:

  • 减轻服务器的负担。AJAX的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。

  • 无刷新更新页面,减少用户心理和实际的等待时间。特别的,当要读取大量的数据的时候,不用像Reload那样出现白屏的情况,AJAX使用XMLHTTP对象发送请求并得到服务器响应,在不重新载入整个页面的情况下用Javascript操作DOM最终更新页面。所以在读取数据的过程中,用户所面对的不是白屏,是原来的页面内容(也可以加一个Loading的提示框让用户知道处于读取数据过程),只有当数据接收完毕之后才更新相应部分的内容。这种更新是瞬间的,用户几乎感觉不到。

  • 带来更好的用户体验。

  • 可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。

  • 可以调用外部数据。

  • 基于标准化的并被广泛支持的技术,不需要下载插件或者小程序

  • 进一步促进页面呈现和数据的分离。

四、谁在使用AJAX
  在应用AJAX开发上面,Google当仁不让是表率。Orkut、Gmail、Google Groups、Google Maps、Google Suggest都应用了这项技术。Amazon的A9.com搜索引擎也采用了类似的技术。

  微软也在积极开发更为完善的AJAX应用:它即将推出代号为Atlas的AJAX工具。Atlas的功能超越了AJAX本身,包括整合Visual Studio的调试功能。另外,新的asp.net控件将使客户端控件与服务器端代码的捆绑更为简便。Atlas客户脚本框架(Atlas Clent Script Framework)也使与网页及相关项目的交互更为便利。但Visual Studio 2005中并不包含此项功能。

  微软最近宣布Atlas客户脚本框架将包含如下内容(详细资料请访问Atlas计划网站):

  • 一个可扩展的核心框架,它添加了JavaScript功能:如生命同时期管理、继承管理、多点传送处理器和界面管理。

  • 一个常见功能的基本类库,有丰富的字符串处理、计时器和运行任务。

  • 为HTML附加动态行为的用户界面框架。

  • 一组用来简化服务器连通和网络访问的网络堆栈。

  • 一组丰富的用户界面开发控件,如:自动完成的文本框、动画和拖放。

  • 处理浏览器脚本行为差异的浏览器兼容层面。

  典型的,微软将AJAX技术应用在MSN Space上面。很多人一直都对MS Space服务感到很奇怪,当提交回复评论以后,浏览器会暂时停顿一下,然后在无刷新的情况下把我提交的评论显示出来。这个就是应用了AJAX的效果。试想,如果添加一个评论就要重新刷新整个页面,那可真费事。

  目前,AJAX应用最普遍的领域是GIS-Map方面。GIS的区域搜索强调快速响应,AJAX的特点正好符合这种需求。

五、用AJAX改进你的设计
   AJAX虽然可以实现无刷新更新页面内容,但是也不是什么地方都可以用,主要应用在交互较多、频繁读数据、数据分类良好的Web应用中。现在,让我们举两个例子,看看如何用AJAX改进你的设计。

例子1:数据校验
  在输入fORM表单内容的时候,我们通常需要确保数据的唯一性。因此,常常在页面上提供“唯一性校验”按钮,让用户点击,打开一个校验小窗口;或者等form提交到服务器端,由服务器判断后在返回相应的校验信息。前者,window.open操作本来就是比较耗费资源的,通常由window. showModalDialog代替,即使这样也要弹出一个对话框;后者,需要把整个页面提交到服务器并由服务器判断校验,这个过程不仅时间长而且加重了服务器负担。而使用AJAX,这个校验请求可以由XMLHttpRequest对象发出,整个过程不需要弹出新窗口,也不需要将整个页面提交到服务器,快速又不加重服务器负担。例子2:按需取数据—级联菜单
  以前,为了避免每次对菜单的操作引起的重载页面,不采用每次调用后台的方式,而是一次性将级联菜单的所有数据全部读取出来并写入数组,然后根据用户的操作用JavaScript来控制它的子集项目的呈现,这样虽然解决了操作响应速度、不重载页面以及避免向服务器频繁发送请求的问题,但是如果用户不对菜单进行操作或只对菜单中的一部分进行操作的话,那读取的数据中的一部分就会成为冗余数据而浪费用户的资源,特别是在菜单结构复杂、数据量大的情况下(比如菜单有很多级、每一级菜又有上百个项目),这种弊端就更为突出。

  现在应用AJAX,在初始化页面时我们只读出它的第一级的所有数据并显示,在用户操作一级菜单其中一项时,会通过Ajax向后台请求当前一级项目所属的二级子菜单的所有数据,如果再继续请求已经呈现的二级菜单中的一项时,再向后面请求所操作二级菜单项对应的所有三级菜单的所有数据,以此类推……这样,用什么就取什么、用多少就取多少,就不会有数据的冗余和浪费,减少了数据下载总量,而且更新页面时不用重载全部内容,只更新需要更新的那部分即可,相对于后台处理并重载的方式缩短了用户等待时间,也把对资源的浪费降到最低。

例子3:读取外部数据
  AJAX可以调用外部数据,因此,可以对一些开发的数据比如XML文档、RSS文档进行二次加工,实现数据整合或者开发应用程序。六、AJAX的缺陷

  AJAX不是完美的技术。使用AJAX,它的一些缺陷不得不权衡一下:

  • AJAX大量使用了Javascript和AJAX引擎,而这个取决于浏览器的支持。IE5.0及以上、Mozilla1.0、NetScape7及以上版本才支持,Mozilla虽然也支持AJAX,但是提供XMLHttpRequest的方式不一样。所以,使用AJAX的程序必须测试针对各个浏览器的兼容性。

  • AJAX更新页面内容的时候并没有刷新整个页面,因此,网页的后退功能是失效的;有的用户还经常搞不清楚现在的数据是旧的还是已经更新过的。这个就需要在明显位置提醒用户“数据已更新”。

  • 对流媒体的支持没有FLASH、Java Applet好。

  • 一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax。

“什么是AJAX开发”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

--结束END--

本文标题: 什么是AJAX开发

本文链接: https://www.lsjlt.com/news/82172.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 什么是AJAX开发
    本篇内容介绍了“什么是AJAX开发”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! ...
    99+
    2022-10-19
  • Struts2中的Ajax开发方法是什么
    本篇内容介绍了“Struts2中的Ajax开发方法是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!首先不谈Struts2的原生支持,我们...
    99+
    2023-06-17
  • ajax与传统web开发的区别是什么
    本篇内容介绍了“ajax与传统web开发的区别是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!AJAX...
    99+
    2022-10-19
  • ajax是网页开发技术吗
    这篇文章主要介绍“ajax是网页开发技术吗”,在日常操作中,相信很多人在ajax是网页开发技术吗问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”ajax是网页开发技术吗”的疑惑...
    99+
    2022-10-19
  • 什么是AJAX
    这篇文章主要讲解了“什么是AJAX”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“什么是AJAX”吧!为了更好的阅读本系列教程,对读者有如下要求:l 熟悉HT...
    99+
    2022-10-19
  • ajax发送请求的方法是什么
    Ajax发送请求的方法有多种,常见的有以下几种:1. XMLHttpRequest(XHR):最原始的Ajax方法,通过创建XMLH...
    99+
    2023-09-13
    ajax
  • 什么是javaweb开发
    Java:简单来说,Java是一门语言,是一门和计算机交流的语言。Web:web(World Wide Web)即全球广域网,它是一种分布式图形信息系统。简单来说就是 浏览器上的一个个网站。Java Web:是用Java技术来解决相关web...
    99+
    2021-04-19
    java入门 javaweb 开发
  • 什么是Web开发
    本篇文章给大家分享的是有关什么是Web开发,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。1、 桌面应用程序开发桌面应用程序开发,是一种比较基本...
    99+
    2022-10-19
  • php开发是什么
    php是一种编程脚本语言,即超文本预处理器,具有非常强大的功能,所有的CGI的功能php都能实现,而且php可以用C、C++进行程序的扩展,几乎支持所有流行的数据库以及操作系统,能够用于管理动态内容、支持数据库、处理会话跟踪,甚至构建整个电...
    99+
    2022-10-07
  • 什么是java web开发
    Java Web,是用Java技术来解决相关web互联网领域的技术总和。web包括:web服务器和web客户端两部分。Java在客户端的应用有java applet,不过使用得很少,Java在服务器端的应用非常的丰富,比如Servlet,J...
    99+
    2014-07-04
    java web
  • 什么是Ajax请求
    一、Ajax请求 JAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。技术内容包括: HTML 或 XHTML, CSS, JavaScr...
    99+
    2023-10-29
    Ajax
  • Ajax是什么意思
    这篇文章将为大家详细讲解有关Ajax是什么意思,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。什么是 AJAXAJAX = Asynchronous JavaScript ...
    99+
    2022-10-19
  • ajax开发守则有哪些
    小编给大家分享一下ajax开发守则有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧! 1. 前、后...
    99+
    2022-10-19
  • 使用AJAX进行PHP开发
    这篇文章主要讲解了“使用AJAX进行PHP开发”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“使用AJAX进行PHP开发”吧!  创建一个简单的相册   本文将使用两种方法创建一个简单的相册:...
    99+
    2023-06-10
  • java开发步骤是什么
    java开发步骤 (推荐学习:java课程)1、源程序的编写和保存:JAVA 程序的编译:...
    99+
    2014-10-31
    java入门 java
  • 什么是中间件开发
    本篇内容介绍了“什么是中间件开发”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!什么是中间件开发我大四实习时...
    99+
    2022-10-19
  • JavaScript开发技巧是什么
    本篇内容介绍了“JavaScript开发技巧是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!1. 有条...
    99+
    2022-10-19
  • css开发中Rocket是什么
    这篇文章主要介绍了css开发中Rocket是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。 Rocket 是一个用于创建网页动画的简单...
    99+
    2022-10-19
  • web开发中Less是什么
    这篇文章主要介绍了web开发中Less是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。   Less是什么?   Less是一种CS...
    99+
    2022-10-19
  • web开发中workerman是什么
    这篇文章主要为大家展示了“web开发中workerman是什么”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“web开发中workerman是什么”这篇文章吧。 ...
    99+
    2022-10-19
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作