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用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
1、创建XMLHttpReuest语法:variable=new XMLHttpRequest();
老版本的IE(IE5和IE6)使用ActiveX对象,语法:
variable=new ActiveObject("Microsoft.XMLHTTP");为了应对所有的现代浏览器,需要先检查浏览器是否支持XMLHttpRequest对象。
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时,表示相应已就绪。
五、总结:
原文链接:https://www.f2er.com/ajax/161924.html