Ajax简介

Ajax:

全称是 Asynchronous JavaScript And XML,中文翻译为异步的JavaScript和XML,是一种用于创建快速动态网页的技术。不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。
注意:Ajax不是新的编程语言!!!而是一种使用现有标准的新方法!!!

为了在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容。由 Jesse James Garrett 在2005年提出Ajax这个概念。即通过在后台与服务器进行少量数据交换,使网页实现异步更新。

它本身不是单一技术,是一串技术的集合,主要有:

  1. JavaScript:通过用户或其他与浏览器相关事件捕获交互行为;
  2. XMLHttpRequest对象:通过这个对象可以在不中断其它浏览器任务的情况下向服务器发送请求;
  3. 服务器上的文件:以XML、HTML或JSON格式保存文本数据;
  4. 其它JavaScript:解释来自服务器的数据(比如PHP从MySQL获取的数据)并将其呈现到页面上。

Ajax的优势主要有以下几点:

  1. 不需要插件支持(一般浏览器且默认开启JavaScript即可);
  2. 用户体验极佳(不刷新页面即可获取可更新的数据);
  3. 提升Web程序的性能(在传递数据方面做到按需放松,不必整体提交);
  4. 减轻服务器和带宽的负担(将服务器的一些操作转移到客户端);

而Ajax的不足有以下几点:

  1. 不同版本的浏览器对XMLHttpRequest对象支持度不同(特别是IE5以下);
  2. 前进、后退的功能被破坏(因为Ajax永远在当前页,不会记录前后页面);
  3. 搜索引擎的支持度不够(因为搜索引擎爬虫还不能理解JS引起变化数据的内容);

执行过程:

  1. 准备页面请求,创建XMLHttpRequest对象;
  2. 使用XMLHttpRequest对象的open()和send()方法发送资源请求给服务器;
  3. 后台计算;
  4. 使用onreadystatechange函数,监听服务器,状态改变时发送数据回客户端;
  5. 使用XMLHttpRequest对象的responseText或responseXML属性获得服务器的响应;

以get方法为例:

<script>
	// 创建XMLHttpRequest对象
	var ajax; // 考虑IE兼容
	if (window.XMLHttpRequest) ajax=new XMLHttpRequest();
	else ajax=new ActiveXObject("Microsoft.XMLHTTP");
	// 使用XMLHttpRequest对象的open()和send()方法发送资源请求给服务器
	ajax.open("GET",url,true); // get请求,url为请求地址,true代表异步
	ajax.send();
	// 使用onreadystatechange函数,监听服务器,状态改变时发送数据回客户端
	ajax.onreadystatechange=function(){
		if (ajax.readyState==4 && ajax.status==200){
			// 使用XMLHttpRequest对象的responseText或responseXML属性获得服务器的响应
			document.innerHTML=ajax.responseText;
		}
	}
</script>
发布了51 篇原创文章 · 获赞 69 · 访问量 2万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章