日期:2014-05-16  浏览次数:20806 次

一起来学Ajax(一)之初识Ajax

    这几天正在学ASP.NET Ajax,学的有点迷糊,所以决定先学Ajax,再向ASP.NET Ajax过渡,本文将带大家初识Ajax,从宏观上看Ajax,再从细节部分学习,文章脉络如下。

  • Ajax定义
  • Ajax组成
  • XMLHttpRequest
  • 常见Ajax使用
  • Ajax客户端生命周期
  • 实现原理
  • 一个简单的实例

Ajax定义

        Ajax是Asynchronous JavaScript and XML(异步JavaScript和XML)的缩写,它不是一种新的编程语言,而是一种使用现有标准的新方法。看全称好像只有JavaScript和XML,其实Ajax并不是只包含JavaScript和XML,Ajax是由JavaScript、XML、CSS、DOM和XMLHttpRequest等组成的。

Ajax组成

       除了Json和XMLHttpRequest,其它的以前都学习过,所以简略介绍一下。

        1、HTML/XHTML:用于描述Ajax页面的初始样式,即首次加载显示的页面。
        2、DOM:Document Object Model(文件对象模型),用来表示XML数据结构。
        3、CSS:Cascading Style Sheet(层叠样式表)达式,用来表示HTML文件中元素出现的样式。
        4、XML和JSON:XML是标准的数据样式,无论是服务器端还是客户端都可以很好地对其进行解释,
JSON:JavaScript Object Notation,因为JSON的格式和JavaScript中定义对象的语法一致, 对于同样的数据,JSON要比XML更简短,减少了网络流量。
        5、服务器端处理浏览器请求:开发者可以选择他所熟悉的方式进行服务器端设计实现。
        6、XMLHttpRequest对象:它允许开发者在javaScript中以异步的方式向服务器发出HTTP请求并得到响应。
        7、JavaScript:通过JavaScript可以将上述元素联系在一起,例如通过JavaScript查看修改DOM、CSS等。

XMLHttpRequest对象

        XMLHttpRequest对象是AJAX和Web 2.0应用程序的技术基础,AJAX利用XMLHttpRequest来实现发送和接收HTTP请求与响应信息。一个经由XMLHttpRequest对象发送的HTTP请求不需要页面中拥有或回寄一个<form>元素。AJAX中的"A"代表了"异步",这意味着XMLHttpRequest对象的send()方法可以立即返回,从而让Web页面上的其它HTML/JavaScript继续其浏览器端处理而由服务器处理HTTP请求并发送响应。缺省情况下请求是异步进行的,你也可以选择发送同步请求,这将会暂停其它Web页面的处理,直到该页面接收到服务器的响应为止,在使用XMLHttpRequest对象发送请求和处理响应之前,必须先用JavaScript创建一个XMLHttpRequest对象。

        XMLHttpRequest属性

属    性

描    述

onreadystatechange

每个状态改变时都会触发这个事件处理器,通常会调用一个JavaScript函数

readyState

请求的状态。有5个可取值:0 = 未初始化,1 = 正在加载,