标签:
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
Ajax包含下列技术:
基于web标准(standards-basedpresentation)XHTML+CSS的表示;
使用 DOM(Document ObjectModel)进行动态显示及交互;
使用 XML 和 XSLT 进行数据交换及相关操作;
使用 XMLHttpRequest 进行异步数据查询、检索;
使用 JavaScript 将所有的东西绑定在一起。
Ajax应用程序的优点:
1. 通过异步模式,提升了用户体验
2. 优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用
3. Ajax引擎在客户端运行,承担了一部分本来由服务器承担的工作,从而减少了大用户量下的服务器负载。
ajax的缺点
1、ajax不支持浏览器back按钮。
2、安全问题 AJAX暴露了与服务器交互的细节。
3、对搜索引擎的支持比较弱。
4、破坏了程序的异常机制。
5、不容易调试。
Ajax可以实现动态不刷新(局部刷新)
就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改变过的信息。
Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。通过XMLHttpRequest对象,Web开发人员可以在页面加载以后进行页面的局部更新。
open(“method”,”URL”) 建立对服务器的调用,
第一个参数是HTTP请求 方式可以为GET,POST或任何服务器所支持的您想调用的方式。
第二个参数是请求页面的URL。
send()方法,发送具体请求
abort()方法,停止当前请求
readyState属性 请求的状态 有5个可取值0=未初始化 ,1=正在加载
2=以加载,3=交互中,4=完成
responseText 属性 服务器的响应,表示为一个串
reponseXML 属性 服务器的响应,表示为XML
status 服务器的HTTP状态码,200对应ok 400对应not found
案例:
1 <script type="text/javascript"> 2 //实例化内建对象 3 var xhr = new XMLHttpRequest() 4 //发起一个请求 5 xhr.open(‘get‘,‘index.php‘); 6 //请求头 get请求可以省略 7 xhr.setRequestHeader(‘get‘,‘index.php‘); 8 //post情况下这步需要这样写 9 /*xhr.setRequestHeader(‘Content-type‘,‘application/x-www=form-urlencoded‘);*/ 10 //请求主体 11 xhr.send(null); 12 //监听接收服务器请求状态 13 xhr.onreadystatechange = function(){ 14 //判断请求状态和服务器的状态码 15 if(xhr.readyState = 4 && xhr.status == 200){ 16 var result = document.querySelector(‘.result‘); 17 result.innerHTML = xhr.responseText; 18 } 19 } 20 21 </script>
标签:
原文地址:http://www.cnblogs.com/huanghundaxia/p/5734192.html