`
rockyuse
  • 浏览: 192241 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

认识AJAX

 
阅读更多
AJAX(Asynchronous JavaScript and XML)是多种技术的综合,
它使用Javascript绑定和处理所有数据。
使用XMLHttpRequest对象进行异步数据读取,
使用XML或json进行数据交换与处理,
使用DOM实现动态显示和交互,
使用XHTML和CSS标准化呈现,
更重要的是它打破了使用页面重载的惯例技术组合,可以说AJAX已成为Web开发的重要武器!

XHR.readyState五种状态 
XHR.readyState == 状态(0,1,2,3,4)

0:请求未初始化,还没有调用 open()。 
1:请求已经建立,但是还没有发送,还没有调用 send()。   //常用 
2:请求已发送,正在处理中(通常现在可以从响应中获取内容头)。 
3:请求在处理中;通常响应中已有部分数据可用了,没有全部完成。
4:响应已完成;您可以获取并使用服务器的响应了 //常用

服务器端状态
XHR.status == 200,300,404 等
100——客户必须继续发出请求
101——客户要求服务器根据请求转换HTTP协议版本
200——成功 常用201——提示知道新文件的URL
300——请求的资源可在多处得到
301——删除请求数据
404——没有发现文件、查询或URl
500——服务器产生内部错误

具体代码
function ajax(){
	var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');

	xhr.open('GET', '1.do?id=123', true); // true-异步,false-同步
	//xhr.open("POST", "1.do", true); // true-异步,false-同步

	xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); // POST请求必须加

	xhr.send(null); //GET发送null
	xhr.send("path=" + encodeURIComponent("aa&bb=c")); //POST发送的内容使用encodeURIComponent把字符串作为 URI 组件进行编码


	xhr.onreadystatechange = function(){
		if(xhr.readyState == 1){
			document.getElementById('ReadyState').innerHTML = "请求已经建立";// 等待时用图片显示
		}
		if(xhr.readyState == 4 && xhr.status == 200){
	    	var callbackVal = xhr.responseText;
			document.getElementById('Callback').innerHTML = callbackVal; //标志位 成功时显示内容
		}
	}
}
 
分享到:
评论

相关推荐

    认识Ajax的作用,对象及属性

    ajax的作用,ajax的对象及属性都作了详细的介绍,是自己总结的一点东西,能够帮助大家初步认识并使用ajax技术

    初步认识Ajax

    快速认识Ajax,简单,易于上手 AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML) AJAX 不是新的编程语言,而是一种使用现有标准的新方法。 AJAX 是一种在无需重新加载整个网页的情况下,能够...

    认识AjAX&jQery的基础

    可以很好的认识这方面的内容与大家交流与发展

    关于ajax的初步认识

    初步认识ajax,可以看到一些关于ajax的认知

    ajax使用简单demo

    本例子提供给对ajax只是想用而又无从下手的程序员。从过该例的调试初步认识ajax,为以后更好的运用ajax埋下伏笔。

    Ajax开发详解

    《Ajax开发简略》发布之后,参考朋友和网友的意见,开始整理撰写《Ajax开发详解》,试图将自己所理解的...了解B/S请求响应机制以及响应的Web开发模式将有助于理解Ajax在Web系统中所处的位置,更好的认识Ajax的作用。

    PHP培训教程之AJAX技术.docx

    1、AJAX初步认识 AJAX的全称AsynchronousJavaScriptAndXML. AJAX2005年由Google发起并流行起来的编程方法,AJAX不一个新的编程语言,但它一个使用已有标准的新的编程技术。一种创建交互式网页应用的网页发技术。 ...

    《4天学会Ajax》教程 pdf

    第一天带您认识Ajax;第二天走进JavaScript 和Ajax异步请求;第三天学习Ajax高级请求和响应;第四天利用DOM进行Web 响应。  本文的作者是一位Ajax 专家,他演示了这些技术如何协同工作—— 从总体概述到细节的讨论...

    初步使用ajax.pdf

    对ajax的初步了解和简单使用方法。 内容:初步认识ajax;ajax的同步和异步;ajax状态码;ajax请求兼容问题;发送带参数的GET/POST请求;封装ajax的过程;

    Ajax入门与提高(ppt)

    Ajax入门与提高(ppt)·····从基础的学习到实践!全面认识ajax

    Ajax教程(HTML版)

    提供最全的Ajax教程,从最初级的学习开始,不断的提升,一步一步的认识Ajax的作用、发展、最新技术等等。

    ajax的应用

    初步认识ajax技术,通过简单的例子学习,让我们深深的体会都它的强大。

    ajax讲义讲座:重新认识web及ajax在web中的应用

    我做ajax的讲座的ppt,有兴趣的...谈了对web应用的重新认识,web的特点,用户的需求,互联网web应用的趋势,ajax在web中的应用,什么是ajax,ajax的知识结构,ajax的核心XHR实现异步,ajax的框架,ajax的未来,air技术

    AJAX 实现的实时监测模块

    开发工具:Myeclipse7.0 服务器:Tomcat 数据库:Mysql 技术: JDBC+Servlet+Ajax 功能:定时的检测你的数据库中某个表的记录数量。...心得:通过这个小功能,认识了Ajax的核心思想 XMLHttpRequest对象

    Ajax基础培训_2012_12_6

    Ajax基础培训_ppt,保证看完之后,你会对Ajax有了新的认识。

    Ajax介绍的学习文档

    通过该文档,能让你对Ajax技术有初步的认识与应用

    ajaxajax视频教材

    ajax视频教材,是认识ajax有很大的帮助

    对ajax的初步认识及实例

    适合初级学习ajax的

    尚硅谷_Ajax

    Ajax的技术的产生 Ajax被认为是(Asynchronous JavaScript and XML的缩写)。现在,允许浏览器与服务器通信而无须刷新当前...而Ajax这项技术,是Google在Google Labs发布Google Maps和Google Suggest后真正为人所认识。

    ajax快速通道

    老手能够快速学习的另一个重要的诀窍是:认识很多牛人朋友 如果没有李锟与赵泽欣的专家级指导与帮助,如果没有与李锟AJAX结对 编程的体验,如果没有三个人在MSN上无数次的长聊,我想要在短期内建立起: 对于AJAX...

Global site tag (gtag.js) - Google Analytics