`
miracle9i
  • 浏览: 35728 次
  • 性别: Icon_minigender_1
  • 来自: 福州
社区版块
存档分类
最新评论

AJAX的整个页面过程

    博客分类:
  • AJAX
阅读更多

 

AJAX的核心是其事件处理函数,其典型过程如下:
1.初始化 XMLHttpRequest对象
2. 指定回调函数,即设定 XMLHttpRequest对象的onreadystatechange属性
3.创建http请求,即调用 XMLHttpRequest对象的open()方法
4.设置http请求头,即调用 XMLHttpRequest对象的setResourceHeader方法
5.发送http请求,即调用 XMLHttpRequest对象的send()方法
 
当open()的asynchoronize参数设定为true(也就是默认值)时,当readystate的值发生改变时,就会将控制转交给回调函数处理。
回调函数可以分为请求处理函数和业务处理函数。前者判断http请求头,并做必要的异常处理;后者分析并加工相应的数据,根据既定业务需求更新页面内容。
回调函数的一般过程:
1.判断http请求的状态,并做相应的处理
    仅当 readystate==4&&status==200 时,才可返回相应的属性
2.处理返回的responseText或responseXML,可以做主要两类处理:
            (1 ) 处理解析XML并存储于客户端的JS领域模型对象中
            (2) 处理的数据存储于缓存数组中
3.调用业务处理函数,解析DOM,定位节点,更新页面
因此,整个页面的AJAX的过程如下:
1.初始化页面
2.对页面操作,触发元素的事件处理函数
3.元素的事件处理函数调用AJAX事件处理函数,同时传给AJAX事件处理函数必要的发给服务器端的参数数据
4.AJAX事件处理函数创建XMLHttpRequest对象,发送http请求,接收请求,必要时将控制权交由回调函数
5.请求处理函数:判断http请求
6.业务处理函数,更新到视图
以下的时序图完整诠释了以上描述的繁琐过程:
分享到:
评论

相关推荐

    ajax 注册页面代码

    本示例中的“Ajax注册页面代码”是利用Ajax技术实现用户注册功能的一种方式,它提供了更好的用户体验,因为用户在提交表单时无需等待整个页面重新加载。 在创建Ajax注册页面时,主要涉及以下几个关键知识点: 1. *...

    ajax实现页面内部模块更新

    1. **局部刷新**:使用Ajax,可以在不重新加载整个页面的情况下,只更新需要的部分。这可以通过修改DOM元素实现,例如使用`innerHTML` 属性替换目标区域的内容。 2. **JSON数据交换**:虽然名称包含XML,但现在更多...

    ajax页面交互

    - **局部刷新**:Ajax可以只更新页面的特定部分,避免整个页面的重绘,提高用户体验。 - **进度条**:通过监听XMLHttpRequest的`progress`事件,可以实现上传或下载的进度显示。 - **错误处理**:合理处理网络错误和...

    使用Ajax实现页面表格添删改查的异步刷新操作

    "使用Ajax实现页面表格添删改查的异步刷新操作"是一个实用的技术实现,它允许用户在不刷新整个页面的情况下更新表格内容,从而提高页面响应速度和用户体验。 首先,我们需要理解AJAX的基本原理。AJAX通过JavaScript...

    Ajax简介Ajax.API

    Ajax 的优点在于可以在不刷新整个页面的情况下与服务器进行通讯。这个技术可以将网页上的某个部分更新,而不需要刷新整个页面,从而提高了用户体验。 Ajax 的工作原理 Ajax 的核心是 JavaScript 对象 ...

    Django结合ajax进行页面实时更新的例子

    而Ajax(Asynchronous JavaScript and XML)是一种在不重新加载整个网页的情况下,更新部分网页内容的技术。通过Ajax,我们可以实现前端与后端的异步通信,提高交互性。 **步骤一:配置URL** 在Django项目中,我们...

    Ajax页面载入,等待特效

    Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新,为用户提供了更流畅、快速的交互体验。本篇...

    ajax+jsp局部页面刷新

    通过结合Ajax与JSP技术,开发者可以实现在不完全重载整个页面的前提下,仅更新特定部分的数据,这一过程不仅提高了网页响应速度,还优化了用户的交互体验。本文将深入探讨如何运用Ajax与JSP实现局部页面的自动刷新,...

    Jquery Ajax 存储过程分页

    AJAX(异步JavaScript和XML)则允许网页在不刷新整个页面的情况下,与服务器交换数据并更新部分网页内容,提高了用户交互性。 在ASP.NET中,我们通常使用C#语言编写后端代码。存储过程是SQL Server中预编译的SQL...

    Ajax全新教程 无刷新页面 无刷新数据更新 无刷新绑定 asp.net全新Ajax教程

    在传统的网页交互中,用户触发操作如点击按钮或填写表单,通常会导致整个页面刷新,重新加载所有资源。而使用Ajax,页面的某一部分可以动态更新,用户在视觉上不会感知到页面的整体刷新,只有相关区域发生变化,提升...

    Ajax自由拖动网页布局

    Ajax 是一种在不重新加载整个网页的情况下,能够更新部分网页内容的技术。它通过后台与服务器进行少量数据交换,使网页实现异步更新。这种方式使得网页更加动态,提高了用户体验,尤其是在处理大量数据或需要频繁...

    Java Ajax 网页聊天源码

    **Ajax**(Asynchronous JavaScript and XML)是一种在不刷新整个页面的情况下更新部分网页的技术。它通过JavaScript与服务器进行异步通信,使用户体验更加流畅。Ajax的核心组件包括XMLHttpRequest对象,负责在后台...

    AjaxRequest(Ajax使用包)

    在Web开发中,AjaxRequest通常用于提高用户体验,因为用户不必等待整个页面刷新,只更新需要变动的部分。 **Ajax的核心技术** 1. **JavaScript**: 驱动Ajax的核心语言,通过创建XMLHttpRequest对象来发送异步请求...

    AJAX安装.rar

    - **AJAX回调**:当用户触发一个AJAX事件时,服务器端代码执行并返回结果,而不会重新加载整个页面。回调通常涉及到XMLHttpRequest对象,但ASP.NET AJAX框架简化了这一过程。 - **Web服务和Page Methods**:AJAX可以...

    asp版ajax用户注册 ajax 注册程序 asp版 ajax

    Ajax的核心在于通过JavaScript在客户端与服务器端进行异步数据交互,无需刷新整个页面即可更新部分网页内容,提供更流畅的用户体验。在这个程序中,我们看到以下几个关键组成部分: 1. **reg.asp**:这是用户注册...

    Ajax Test Ajax Test

    - **异步通信**:Ajax的核心是XMLHttpRequest对象,它使得JavaScript可以向服务器发送异步请求,即在不重新加载整个页面的情况下获取或发送数据。 - **JavaScript**:作为Ajax的主要驱动,JavaScript负责处理用户...

    Ajax从入门到精通.pdf

    Ajax技术作为近年来Web开发领域的一项重大突破,通过异步数据交换与服务器通信,使得无需重新加载整个页面即可更新网页部分区域,极大地提升了用户体验。本文将探讨从Ajax基础知识到高级应用的完整知识体系,以期...

    SharePoint 2013 Ajax造成页面无法编辑.pdf

    在使用 SharePoint 2013 的过程中,部分用户遇到了一个比较特殊的问题:当尝试通过 Ajax 方式加载或更新页面时,会出现“此网页自上次打开后已被修改,必须再次打开该网页”的错误提示,导致页面无法正常编辑或完成...

    AJAX 参考手册 ajax 教程

    - **动态内容加载**:如无限滚动、搜索建议等,无需刷新整个页面即可获取新内容。 - **表单验证**:在提交前验证用户输入,提供即时反馈。 - **局部更新**:例如聊天应用中的消息实时更新,或者地图应用中的定位更新...

    ajax实现jsp页面表格

    在网页开发中,AJAX(Asynchronous JavaScript and XML)是一种技术,它允许我们在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容。在本案例中,“ajax实现jsp页面表格”是一个教学示例,它展示了...

Global site tag (gtag.js) - Google Analytics