Ajax简介

淩亂°似流年 2022-02-23 11:42 184阅读 0赞

**Ajax 简介**

（异步的JavaScript和XML）  
什么是AJAX？  
Ajax不是某种编程语言  
AJAX是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。  
同步与异步  
同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去。  
异步是指进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。  
创建XMLHttpRequest 对象  
什么是XMLHttpRequest 对象？  
XMLHttpRequest 对象用于在后台与服务器交换数据。  
XMLHttpRequest 对象是开发者的梦想，因为它能够：  
 在不重新加载页面的情况下更新网页  
 在页面已加载后从服务器请求数据  
 在页面已加载后从服务器接受数据  
 在后台向服务器发送数据  
创建XMLHttpRequest对象的语法：  
xmlhttp= new XMLHttpRequest（）；  
向服务器发送请求  
向服务器发送请求，我们使用XMLHttpRequest 对象的open（）和send（）方法：  
open（method、URL、async） 规定请求的类型、URL 以及是否异步处理请求。  
参数说明：  
 method：请求的类型：GET和POST  
 URL：文件在服务器上的位置  
 async：true（异步）或false（同步）  
 send（string-仅用于POST请求）：将请求发送到服务器。  
如果要像HTML表单那样POST数据，可以用setRequestHeader（）来添加HTTP头。然后send（）方法中规定你要发送的数据；  
setRequestHeader 语法：  
setRequestHeader（header，value）：向请求添加HTTP头。  
参数说明：  
header：规定头的名称  
value：规定头的值  
服务器响应  
使用XMLHttpRequest 对象的responseText或responseXML属性获取来自服务器的响应。  
responseText：获得字符串形式的响应数据。  
responseXML：获得XML形式的响应数据。  
document.getElementById(“myDiv”).innerHTML = xhr.responseText;  
//innerHTML 属性设置或返回元素的inner HTML。  
onreadystatechange 事件  
每当readyState 改变时，就会触发onreadystatechange 事件。  
readyState 属性存有XMLHttpRequest 的状态信息  
下面是XMLHttpRequest 对象的三个重要的属性：  
Onreadystatechange：存储函数（或函数名），每当readyState属性改变时，就会调用该函数。  
readyState：存有XMLHttpRequest的状态。从0到4发生变化。  
0：请求未初始化  
1：服务器连接已建立  
2：请求已接收  
3：请求处理中  
4：请求已完成，且响应已就绪  
HTTP状态消息：  
200: 请求成功。  
404：服务器无法找到被请求的页面。  
500：请求未完成，服务器遇到不可预知的情况。  
\*\*\*\*\*\*  
用jQuery实现Ajax  
jQuery.ajax(\{settings\});  
type:类型，“POST”或“GET”，默认值为”GET”.  
URL：发送请求的地址。  
async：设置异步，（默认：true）默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为false。注意：同步请求将锁住浏览器，用户其他操作必须等待请求完成才可以执行。  
data：是一个对象，连同请求发送到服务器的数据  
dataType：预期服务器返回的数据类型，如果不指定，jQuery将自动根据http包MIME信息来智能判断，一般我们采用json格式，可以设置为“json”。  
success：是一个方法，请求成功后的回调函数，传入返回后的数据，以及包含成功代码的字符串。  
error：是一个方法，请求失败是调用此函数，传入XMLHttpRequest对象。  
jQuery.get()以GET方式从服务器获取数据  
语法：jQuery.get(url,\[data\],\[callback\],\[type\])  
描述：通过远程HTTP GET请求载入信息。  
这是一个简单的GET请求功能以取代复杂 . a j a x 。 请 求 成 功 时 可 调 用 回 调 函 数 。 如 果 需 要 在 出 错 时 执 行 函 数 ， 请 使 用 .ajax。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 .ajax。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用.ajax。  
参数说明：  
url待载入页面的URL地址  
data：待发送Key/value 参数  
callback：载入成功时回调函数  
type：返回内容格式，XML,html，script，json，text。  
JQuery.post（）以POST方式从服务器发送数据  
。。。