AJAX——入门基础

AJAX=Asynchronous JavaScript and XML（异步的JavaScript和XML）。AJAX不是新的编程语言，而是一种使用现有标准的新方法，AJAX通过在后台与服务器进行少量数据交换，可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。而传统的网页（不使用AJAX）如果需要更新内容，必须重新加载整个网页面。

AJAX的一个经典应用就是Google Sugget：Google Sugget使用AJAX创造出动态性极强的web界面，当您在谷歌的搜索框输入关键字时，JavaScript会把这些字符发送到服务器，然后服务器会返回一个搜索建议的列表。

二、AJAX工作原理：

三、XMLHttpRequest：

XMLHttpRequest是AJAX的基础。所有现代浏览器均支持XMLHttpRequest对象。（IE5和IE6.0使ActiveObject），XMLHttpRequest用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

   variable=new XMLHttpRequest();

老版本的IE（IE5和IE6）使用ActiveX对象，语法:

    variable=new ActiveObject("Microsoft.XMLHTTP");

    var xmlhttp;
    if(window.XMLHttpRequest)
      {
       xmlhttp=new XMLHttpRequest();
      }
    else
      {
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }

2、与服务器交换数据：

如果需要将请求发送到服务器，我们使用open()和send()方法。

方法：open（method，url，async） 描述：规定请求的类型、URL以及是否异步处理请求。
.method：请求的类型：GET或POST
.url：文件在服务器上的位置
.async：true（异步）或false（同步）


方法：send（string） 描述：将请求发送到服务器
.string：仅用于POST请求

3、GET或POST
与POST相比，GET更简单也更快，并且在大部分情况下都能用。然而，在以下情况中，请使用POST请求：
①无法使用缓存文件（更新服务器上的文件或数据库）
②向服务器发送大量数据（POST没有数据量限制）
③发送包含未知字符的用户输入时，POST比GET更稳定也更可靠。
4、异步--True或False？
XMLHttpRequest对象如果要用于AJAX的话，其open方法的async参数必须设置为true：
xmlhttp.open（"GET","ajax_test.asp",true）;
对于web开发人员而言，发送异步请求是一个巨大的进步。很多在服务器执行的任务都相当费事。AJAX出现之前，这


可能会引起应用程序挂起或停止。
通过AJAX，JavaScript无需等待服务器的相应，而是：
.在等待服务器响应时执行其他脚本。
.当相应就绪后对相应进行处理。
需要注意的是，当使用async=true时，需要规定相应处理onreadystatechange事件中的就绪状态时执行的函数。


四、onreadystatechange事件：
首先我们先介绍一下XMLHttpRequest对象的三个重要的属性：

当请求被发送到服务器时，我们需要执行一些基于响应的任务。在onreadystatechange事件中，我们规定当服务器已做好被处理的准备是执行的任务。当readyState = 4且status = 200时，表示相应已就绪。

五、总结：

AJAX前景非常乐观，可以提高系统性能，优化用户界面等。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!