正确AJAX了解该技术的,创建,应用

ajax认识:

1. ajax这是间client与server机制。但这一机制是在前台的,利用前台的闲置功能,来进行前台与后台的数据交流,以达到增强用户体检。降低server压力,更有效的利用带宽的效果。

2. ajax是採用异步交互的机制。

3. ajax使用于页面局部刷新,按需求验证和取数据。

4. ajax缺点便是浏览器的兼容问题麻烦。与嵌入式移动端对ajax的支持不太理想。

5.ajax已经是一种web开发必备的技术,并且其长处远大于缺点。

6.ajax涉及到的主要技术有7种当中Javascript、XMLHttpRequest、DOM、XML为重点。

7. XMLHttpRequest对象

XMLHttpRequest是XMLHTTP组件的对象。通过这个对象,AJAX能够像桌面应用程序

一样仅仅同server进行
数据层面的交换。而不用每次都刷新界面。也不用每次将数据处

理的工作都交给server来做。这样既减轻 了服务器负担又加快了响应速度、缩短了用

户等待的时间。

Javascript

Javascript一直被定位为client的脚本语言。应用最多的地方是表单数据的校验。如今

能够通过Javascript 操作XMLHttpRequest。来跟数据库打交道。

DOM

DOM(Document Object Model)是提供给HTML和XML使用的一组API,提供了文件的

表述结构,并能够利用它改变当中的内容和可见物。脚本语言通过DOM才干够跟页面进

行交互。Web开发者可操作及建立文件的属性、方法以及事件都以对象来展现。比方,

document就代表页面对象本身。

XML

通过XML(Extensible Markup Language)。能够规范的定义结构化数据。是网上传输的

数据和文档符合统一的标准。

用XML表述的数据和文档。能够非常easy的让全部程序共享。

 

ajax的创建:

考虑兼容性:

1.浏览器分为IE与非IE,当中非IE是遵循W3C标准的。创建方式基本同样,而IE不一样,其每一个版本号创建的方式也有所不同。

2.创建ajax

</pre><pre name="code" class="php"><script>
	function createAjax(){
		var request=false;
		//window对象中有XMLHttpRequest存在就是非IE,包含(IE7,IE8)
		if(window.XMLHttpRequest){
			request=new XMLHttpRequest();
			有些浏览器是须要覆盖eMimeType
			if(request.overrideMimeType){
				request.overrideMimeType("text/xml");//指定文本类型
			}

		//window对象中有ActiveXObject属性存在就是IE
		}else if(window.ActiveXObject){
			//将IE各个版本号的浏览器的參数放在一个数组里面
var versions=['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Msxml2.XMLHTTP.7.0','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.5.0','Msxml2.XMLHTT4.0','MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];

		//遍历这个数组,确定是那个版本号,进行相应AJAX的创建
		for(var i=0; i<versions.length; i++)
			{
				try{
					request=new ActiveXObject(versions[i]);
					if(request){return request;}
				}catch(e){
					request=false;
				}
			}
	}
	return request;
	}
	var ajax=createAjax();//创建AJAX
	alert(ajax);測试
</script>

ajax的对象的方法与属性

1. XMLHttpRequest对象的属性:

onreadystatechange状态改变的事件触发器

readyState 对象状态(integer):

0 = 未初始化 1 = 读取中 2 = 已读取 3 = 交互中 4 = 完毕

responseText server进程返回数据的文本版本号

responseXML server进程返回数据的兼容DOM的XML文档对象

status server返回的状态码, 如:404 = "文件未找到" 、200 ="成功"

statusText server返回的状态文本信息

2. XMLHttpRequest对象的方法:

abort()停止当前请求

getAllResponseHeaders()作为字符串返回完整的headers

getResponseHeader("headerLabel")作为字符串返回单个的header标签

open("method","URL"[,asyncFlag[,"userName"[, "password"]]])设置未决的请求的目标 URL,方法,和其它參数

send(content)
发送请求

setRequestHeader("label", "value")设置header并和请求一起发送

版权声明:本文博客原创文章,博客,未经同意,不得转载。

时间: 2024-08-10 02:09:28

正确AJAX了解该技术的,创建,应用的相关文章

HTML5前端入门教程:Ajax 异步请求技术

AJAX的全称是Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). ?ajax不是新的编程语言,而是一种使用现有标准的新方法.ajax是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下. ?ajax是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. ?ajax是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换.ajax可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的

框架基础:关于ajax设计方案(三)---集成ajax上传技术

之前发布了ajax的通用解决方案,核心的ajax发布请求,以及集成了轮询.这次去外国网站逛逛,然后发现了ajax level2的上传文件,所以就有了把ajax的上传文件集成进去的想法,ajax方案的level2的改进就不介绍了,不清楚的可到前几篇博客去看看.我们直接切入主题. 概念介绍: 1. js的FormData:js中在新的版本中已经支持了FormData对象,可以初始化一个空的form,或者初始化已经存在的form,浏览器测试代码. 2. 浏览器的支持:浏览器已支持input=file的

框架基础:ajax设计方案(三)---集成ajax上传技术

之前发布了ajax的通用解决方案,核心的ajax发布请求,以及集成了轮询.这次去外国网站逛逛,然后发现了ajax level2的上传文件,所以就有了把ajax的上传文件集成进去的想法,ajax方案的level2的改进就不介绍了,不清楚的可到前几篇博客去看看.我们直接切入主题. 概念介绍: 1. js的FormData:js中在新的版本中已经支持了FormData对象,可以初始化一个空的form,或者初始化已经存在的form,浏览器测试代码. 2. 浏览器的支持:浏览器已支持input=file的

基于ajax与msmq技术的消息推送功能如何实现?

本文和大家分享的主要是基于ajax与msmq技术的消息推送功能相关实现方法,一起来看看吧,希望对大家学习ajax 有所帮助. 我设计的这个推送demo是基于ajax长轮询+msmq消息队列来实现的,具体交互过程如下图: 先说说这个ajax长轮询,多长时间才算长呢?这个还真不好界定. 这里是相对普通ajax请求来说的,通常处理一个请求也就是毫秒级别的时间.但是这里的长轮询方式 在ajax发送请求给服务器之后,服务器给调用端返回数据的时间多长那可还真不好说.嘿嘿,这关键要看 我们啥时候往msmq队列

2018-06-25 js表单事件、三个高度和Ajax异步通讯技术

表单事件: onfocus -> 表单控件得到焦点时触发: obj_ipt.onfocus=function(){}; onblur -> 表单控件失去焦点时: onchange -> 表单控件内容被改变时: onselect -> 控件被选择时: onsubmit -> 当表单提交时: onreset -> 当表单重置时: 表单对象方法: select() -> 对象被选中: ipt_obj.select(); blur() -> 失去焦点 focus()

JQuery 总结(8)Ajax 无刷新技术

Ajax  无刷新技术 $(".delete").click(function () { cf=confirm("确认删除"); if (!cf) { return false } id=this.id; obj=$(this); // var r; $.get('delete.php',{id:id},function (r) { // console.log(r); // alert(r) if (r==1) { // alert(1) obj.parent()

ajax无刷新技术

第一步:创建ajax引擎 var xmlhttp=""; if(window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); }else{ xmlhttp=new ActiveXObject("microsoft.XMLHttp"); } 第二部:判断状态 xmlhttp.onreadystatechange=function(){ if(xmlhttp.readyState==4&&xmlhttp.st

ajax之请求对象的创建以及它与服务器之间的4次“握手”(好吧其实只有3次)

request对象的创建 对于request对象的创建,我们总会第一时间反映到下列语句 var request=new XMLHttpRequest(); 不过因为各大浏览器之间的相互斗殴行为,事情是不会这么简单的. 比如非常经典的:IE浏览器没有XMLHttpRequest函数. 但这难不倒我们聪明机智的程序员,我们也有经典的应对措施: function createRequest(){     try{         request=new XMLHttpRequest();     }c

基于ajax与msmq技术的消息推送功能实现

周末在家捣鼓了一下消息推送的简单例子,其实也没什么技术含量,欢迎大伙拍砖.我设计的这个推送demo是基于ajax长轮询+msmq消息队列来实现的,具体交互过程如下图: 先说说这个ajax长轮询,多长时间才算长呢?这个还真不好界定.这里是相对普通ajax请求来说的,通常处理一个请求也就是毫秒级别的时间.但是这里的长轮询方式在ajax发送请求给服务器之后,服务器给调用端返回数据的时间多长那可还真不好说.嘿嘿,这关键要看我们啥时候往msmq队列中推送数据了,先看看推送的效果图吧..... 抱歉,没弄张