`
vini123
  • 浏览: 39186 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Ajax+PHP实现动态无刷新技术

    博客分类:
  • PHP
阅读更多
据介绍通达OA 短信、在线人员、邮件检查机制,全部采用无刷新技术。我分析后通达用的是Ajax技术。Ajax是多种技术的综合,是一种动态的可以实现WEB页面局部刷新的技术。
Ajax的基本原理
Ajax实现的web交互效果跟传统的大不相同,它通过Ajax 引擎,使得应用过程很自然,操作很流畅,因为其只和服务器交换有用的数据,而页面显示等不必要的数据则不再重新加载。Ajax 引擎其实就是JavaScript、XML、XMLHttpRequest等等各项技术的综合应用。
Ajax技术组成:
1.标准化呈现:XHTML、CSS
2.动态显示和交互:DOM
3.数据交换和处理:XML、XSLT
4.粘合剂:JavaScript,
Ajax的优点:
1.减轻服务器端负担,“按需取数据”。
2.无刷新更新页面。
3.带来更好的用户体验。
4.充分利用客户端闲置的运算能力。
5.进一步促进呈现和数据的分离。
6.完全基于标准化的技术实现,无须下载小程序或插件。
7.浏览器无关(IEownload, XML island)
Ajax适用的场景:
1.表单驱动的交互
2.深层次的树的导航
3.快速的用户与用户间的交流响应
4.类似投票、yes/no等无关痛痒的场景
5.对数据进行过滤和操纵相关数据的场景
6.普通的文本输入提示和自动完成的场景
Ajax不适用的场景:
1.部分简单的表单
2.搜索不能back(使用IFrame)
3.基本的导航
4.替换大量的文本
5.对呈现的操纵
Ajax应用存在的问题:
1.用JavaScript作的Ajax引擎,JavaScript的兼容性和debug都是让人头痛的事。
2.Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带来困扰。
3.中间过程不能被bookmark。(两个方法解决)
使用WEB标准开发:
1.系统现状对应用的自适应性和市场拓展都有阻碍。
2.完全采用符合web标准的方式来开发web层,以支持所有的市场上流行的浏览器,达到很高的可用性。
3.包括使用XHTML,CSS(完全布局),Ajax等标准化技术。(结构/展现/行为完全分离)
4.使用Firefox作为开发环境,浏览器移植问题就会得到解决。

AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。它有机地包含了以下几种技术:
Ajax(Asynchronous JavaScript + XML)的定义:基于web标准(standards-based presentation)XHTML+CSS的表示; 使用 DOM(Document Object Model)进行动态显示及交互;使用 XML 和 XSLT 进行数据交换及相关操作; 使用 XMLHttpRequest 进行异步数据查询、检索; 使用 JavaScript 将所有的东西绑定在一起。
类似于DHTML或LAMP,AJAX不是指一种单一的技术,而是有机地利用了一系列相关的技术。事实上,一些基于AJAX的“派生/合成”式(derivative/composite)的技术正在出现,如“AFLAX”。
AJAX的应用使用支持以上技术的web浏览器作为运行平台。这些浏览器目前包括:Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。但是Opera不支持XSL格式对象,也不支持XSLT。
Ajax技术的核心
Ajax其核心只有JavaScript、XMLHTTPRequest和DOM,如果所用数据格式为XML的话,还可以再加上XML这一项(Ajax从服务器端返回的数据可以是XML格式,也可以是文本等其他格式)。
在旧的交互方式中,由用户触发一个HTTP请求到服务器,服务器对其进行处理后再返回一个新的HTHL页到客户端,每当服务器处理客户端提交的请求时,客户都只能空闲等待,并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据,都要返回一个完整的HTML页,而用户每次都要浪费时间和带宽去重新读取整个页面。而使用Ajax后用户从感觉上几乎所有的操作都会很快响应没有页面重载(白屏)的等待。
1.XMLHTTPRequest
Ajax的一个最大的特点是无需刷新页面便可向服务器传输或读写数据(又称无刷新更新页面),这一特点主要得益于XMLHTTP组件XMLHTTPRequest对象。这样就可以向再发桌面应用程序只同服务器进行数据层面的交换,而不用每次都刷新界面也不用每次将数据处理的工作提交给服务器来做,这样即减轻了服务器的负担又加快了响应速度、缩短了用户等候时间。
最早应用XMLHTTP的是微软,IE(IE5以上)通过允许开发人员在Web页面内部使用XMLHTTP ActiveX组件扩展自身的功能,开发人员可以不用从当前的Web页面导航而直接传输数据到服务器上或者从服务器取数据。这个功能是很重要的,因为它帮助减少了无状态连接的痛苦,它还可以排除下载冗余HTML的需要,从而提高进程的速度。Mozilla(Mozilla1.0以上及NetScape7以上)做出的回应是创建它自己的继承XML代理类:XMLHttpRequest类。Konqueror (和Safari v1.2,同样也是基于KHTML的浏览器)也支持XMLHttpRequest对象,而Opera也将在其v7.6x+以后的版本中支持XMLHttpRequest对象。对于大多数情况,XMLHttpRequest对象和XMLHTTP组件很相似,方法和属性也类似,只是有一小部分属性不支持。
2.JavaScript
JavaScript是一在浏览器中大量使用的编程语言,,他以前一直被贬低为一门糟糕的语言(他确实在使用上比较枯燥),以在常被用来作一些用来炫耀的小玩意和恶作剧或是单调琐碎的表单验证。但事实是,他是一门真正的编程语言,有着自已的标准并在各种浏览器中被广泛支持。
3.DOM
Document Object Model。 DOM是给 HTML 和 XML 文件使用的一组 API。它提供了文件的结构表述,让你可以改变其中的內容及可见物。其本质是建立网页与 Script 或程序语言沟通的桥梁。所有WEB开发人员可操作及建立文件的属性、方法及事件都以对象来展现(例如,document 就代表“文件本身“这个对像,table 对象则代表 HTML 的表格对象等等)。这些对象可以由当今大多数的浏览器以Script 来取用。一个用HTML或XHTML构建的网页也可以看作是一组结构化的数据,这些数据被封在DOM(Document Object Model)中,DOM提供了网页中各个对象的读写的支持。

文章来源:http://www.cnblogs.com/freespider/archive/2012/04/11/2442138.html
分享到:
评论

相关推荐

    jQuery+Ajax+PHP无刷新分页

    **jQuery+Ajax+PHP无刷新分页技术详解** 在网页开发中,无刷新分页是一种提升用户体验的重要技术,它使得用户在浏览大量数据时无需等待整个页面重新加载,只需要加载新内容即可。本篇将详细讲解如何利用jQuery、...

    Jquery+Ajax+Php+Mysql异步刷新

    在本教程中,我们将深入探讨如何利用这些技术实现表单验证的异步刷新。 首先,jQuery是一个轻量级的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。在异步刷新过程中,jQuery使得与服务器通信变得...

    HTML+CSS+ajax+php+mysql实现登录

    3. **Ajax**:AJAX(Asynchronous JavaScript and XML)是一种在不刷新整个页面的情况下更新部分网页的技术。在这个项目中,`js`文件夹中的JavaScript代码(如`ajax.js`)可能包含了使用`XMLHttpRequest`对象实现...

    jQuery+Ajax+PHP+mysql实现无刷新注册/登陆(用户名邮箱验证码等)

    Ajax(异步JavaScript和XML)技术是实现无刷新页面的关键。通过Ajax,前端可以向服务器发送请求并在后台处理数据,然后将结果返回到前端,整个过程对用户来说是透明的。在注册和登录场景中,当用户填写完表单并点击...

    PHP+Ajax+Mysql+jeditable无刷新编辑表格

    本项目"PHP+Ajax+Mysql+jeditable无刷新编辑表格"就是利用这些技术实现了一个高效、便捷的数据编辑功能。下面我们将详细探讨这些技术及其在该项目中的应用。 **PHP**(Hypertext Preprocessor)是一种广泛使用的...

    PHP+ajax+mysql 实现无刷新页面

    **PHP+AJAX+MYSQL 实现无刷新页面详解** 在Web开发中,用户交互体验是至关重要的,而无刷新页面技术则能显著提升这一体验。本文将深入探讨如何利用PHP、AJAX(Asynchronous JavaScript and XML)以及MySQL数据库来...

    php+ajax实现无刷新动态加载数据技术

    实例的实现流程展示了无刷新动态加载数据技术的具体应用,包括了前端的Ajax请求发送、后端的PHP脚本处理以及数据库的数据查询和返回。同时,该技术在实际开发中还应考虑数据安全性、用户交互体验优化、错误处理机制...

    PHP+Ajax+bootstrap+dataTables无刷新分页表格插件

    "PHP+Ajax+bootstrap+dataTables无刷新分页表格插件"的组合就是实现这一目标的有效方式。这个技术栈允许开发者构建出实时更新、无需刷新页面的动态表格,提供高效的数据浏览和管理功能。 首先,PHP是一种广泛使用的...

    ajax+php实现了投票的功能

    在这个基于Ajax和PHP实现的投票功能中,我们探讨的关键知识点主要集中在前端的Ajax技术以及后端的PHP处理。Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页内容的技术...

    ajax+php写的无刷新分页

    无刷新分页是一种提高网页用户体验的技术,通过Ajax(异步JavaScript和XML)和PHP的结合,可以在不重新加载整个页面的情况下获取并显示更多的数据。这种技术在大数据量的列表展示中非常常见,如社交媒体动态、电商...

    thinkphp+ajax无刷新分页

    为了提升用户体验,无刷新页面更新技术变得越来越流行,其中AJAX(Asynchronous JavaScript and XML)成为了实现这一目标的重要工具。结合ThinkPHP框架,可以轻松实现数据的异步加载,从而达到页面局部更新的效果,...

    AJAX+PHP实现的几种效果

    1. **表单无刷新提交**:用户填写表单后,通过AJAX发送数据到PHP,PHP验证数据并处理,然后返回反馈信息,无需刷新页面,用户可以即时看到结果。 2. **实时搜索**:用户在搜索框输入时,AJAX会发送当前输入到PHP,...

    jquery+ajax+php无刷新分页

    以上就是使用jQuery、Ajax和PHP实现无刷新分页的基本步骤。通过这种方式,你可以创建一个高效、用户友好的分页系统,同时避免了页面频繁刷新带来的性能损失。在实际项目中,还可以根据需求进行更复杂的定制,如缓存...

    Ajax+smarty技术实现无刷新分页

    Ajax+Smarty技术实现无刷新分页是一种在Web开发中常用的技术组合,主要用于提高用户体验和减轻服务器负担。这里分别介绍技术涉及的关键点:Ajax技术、Smarty模板引擎、PHP后端处理以及HTML前端设计。 Ajax...

    jq.ajax+php+mysql数据库实现用户无刷新评论

    总结来说,"jq.ajax+php+mysql数据库实现用户无刷新评论"是一种常见的Web开发技术,通过结合前端和后端的优势,实现了数据的实时交互,为用户提供流畅的评论体验。掌握这种技术对于构建高性能、用户友好的Web应用至...

    ajax+asp+mssql无刷新聊天室5.rar

    【标题】:“ajax+asp+mssql无刷新聊天室5.rar”是一个基于Ajax技术、ASP脚本语言和Microsoft SQL Server数据库构建的实时聊天室系统。这个系统的核心特点是无刷新(或称为实时更新),允许用户在不重新加载整个网页...

    PHP+jQuery+Ajax无刷新分页加搜索

    "PHP+jQuery+Ajax无刷新分页加搜索"是一个经典的技术组合,用于构建动态、高效的网页应用。这个技术方案结合了服务器端处理(PHP)、客户端交互(jQuery)以及异步数据交换(Ajax),实现了用户在不重新加载整个页面...

Global site tag (gtag.js) - Google Analytics